Я хочу отображать тег опции, только когда я пишу: select2 - PullRequest
0 голосов
/ 13 сентября 2018

Я использую опцию select2 html, я хочу отображать свой тег опций только тогда, когда я пишу. Например, когда я пишу «а», все страницы отображаются в ее имени, но когда я нажимаю и ничего не пишу, ничего не отображается.

Я использую jquery. Я скрываю тег опции, когда нажимаю, но когда я изменяю свой ввод и пишу, опция не отображается.

<?php
     global $wpdb;
            $post_id = $wpdb->get_results("SELECT `ID`,`post_title` FROM $wpdb->posts WHERE `post_type` = 'page' and `post_status` = 'private'");

    ?>
    <div class="form_search_custom">
            <div id="myDropdown" class="dropdown-content">
                <label class="col-md-3 control-label" for="service"><?php echo $lang['department']; ?> </label>
                <div class="col-md-8">
              <select name="services[]" id="service" class="form-control select2-multiple" multiple>
                  <?php if ( !empty( $post_id ) ) {
                            foreach ($post_id as $value) {
                    ?>
                  <option value="<?php echo($value->ID);?>"><?php echo($value->post_title);?></option>
                 <?php
                        }
                        }               
                 ?>
              </select>
            </div>
        </div>   </div>

        <script>
                jQuery(document).ready(function() {
                     jQuery('#service').select2();

                     jQuery('.select2-selection').on('click', function() {
                        jQuery('.select2-dropdown').hide();
                    }); 

                    var option_val = "";

                    /*jQuery('.').on('change', function() {
                        jQuery('.select2-dropdown').show();
                        option_val = jQuery('.select2-search__field').val();
                        alert(option_val)
                    });
                    jQuery('.select2-search__field').val(option_val);
                    */

                    jQuery('.select2-search__field').change(function() {
                    jQuery('.select2-dropdown').show();
                    var filter = jQuery(this).val();
                    jQuery('option').each(function() {
                      if (jQuery(this).val() == filter) {
                        jQuery(this).show();
                      } else {
                        jQuery(this).hide();
                      }
                      jQuery('select').val(filter);
                    })
                  })
                });     

        </script>

1 Ответ

0 голосов
/ 13 сентября 2018

Вы можете передать минимальное количество букв, необходимое для отображения поиска и отображения данных

$('#service').select2({
    minimumInputLength: 2,
    tags: true
});
...