style multiple event container chosen bootstrap javascript jquery-chosen

javascript - event - jquery chosen select multiple



¿Cómo eliminar el cuadro de búsqueda de Chosen JS? (3)

En github dice que el cuadro de búsqueda ahora era opcional en los cuadros de selección elegidos. ¿Alguien sabe como quitarlo?


chosen.jquery.js acaba de establecer el estilo de display:none cuadro de búsqueda display:none en div con clase chzn-search

<div class="chzn-search"><input type="text" autocomplete="off" style="display:none;" /></div>


solo esconderlo cuando sea necesario con

$(''.chzn-search'').hide();


La versión actual de Chosen proporciona dos métodos para controlar la visualización del cuadro de búsqueda. Ambos se pasan como opciones durante la inicialización. Para ocultar el cuadro de búsqueda, pase completamente la opción "disable_search": true :

$("#mySelect").chosen({ "disable_search": true });

Alternativamente, si desea mostrar la búsqueda si hay un cierto número de opciones, use la opción "disable_search_threshold": numberOfOptions (donde numberOfOptions es el número mínimo de opciones requeridas antes de mostrar el cuadro de búsqueda):

$("#mySelect").chosen({ "disable_search_threshold": 4 });

jQuery(function($) { // Create a set of OPTION elements from some dummy data var words = ["lorem", "ipsum", "dolor", "sit", "amet,", "consectetur", "adipiscing", "elit", "duis", "ullamcorper", "diam", "sed", "lorem", "mattis", "tristique", "integer", "pharetra", "sed", "tortor"], options = $($.map(words, function(word) { return $(document.createElement(''option'')).text(word)[0]; })); $(''select'').each(function() { // Add the dummy OPTIONs to the SELECT var select = $(this).append(options.clone()); // Initialize Chosen, using the options from the // `data-chosen-options` attribute select.chosen(select.data(''chosen-options'')); }); });

body { font-family: sans-serif; font-size: .8em; } label { display: block; margin-bottom: 1.4em; } label .label { font-weight: bold; margin-bottom: .2em; } select { width: 14em; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.5.1/chosen.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.5.1/chosen.jquery.min.js"></script> <label> <div class=''label''>Default behavior</div> <select name=''default'' data-chosen-options=''{}''></select> </label> <label> <div class=''label''>No search at all</div> <select name=''no-search'' data-chosen-options=''{ "disable_search": true }''></select> </label> <label> <div class=''label''>Search iff more than 4 items</div> <select name=''conditional-search'' data-chosen-options=''{ "disable_search_threshold": 4 }''></select> </label> <label> <div class=''label''>Search iff more than 32 items</div> <select name=''conditional-search'' data-chosen-options=''{ "disable_search_threshold": 32 }''></select> </label>