0

我在同一模式中使用各种 jQuery 多选小部件。像往常一样，它们都有一个文本框来过滤显示的选项，但我无法通过单击它们来关注它们。

在寻找解决方案后，我从user2457092找到了这个问题，在那里我找到了问题的部分解决方案：

$("#MyStatusWidget").multiselect({
  open: function () {
    $("input[type='search']:first").focus();                   
  }
});

这段代码解决了我的问题，但仅适用于我在模式上的第一个多选。所以现在我不知道如何使这$("input[type='search']:first").focus();条线适用于每个小部件。

这是我的代码：

<div class="form-group">
    <div class="col-sm-4">
        <?php   
            echo $form->dropDownList($model,'Id', CHtml::listData($model1,'Id','Name'),array(
                'class'     => 'col-sm-2 multiple_select multiple_select_filter_single',
                'options'   => null,                  
            ));  
        ?>
    </div>
    <div class="col-sm-4" >
        <?php   
            echo $form->dropDownList($model,'Id', CHtml::listData($model2,'Id','Name'),array(
                'class'     => 'col-sm-2 multiple_select multiple_select_filter_single',
                'options'   => null,
            ));  
        ?>
    </div>
</div>
<div class="form-group">
    <div class="col-sm-4">
        <?php 
            echo $form->dropDownList($model,'Id', CHtml::listData($model3,'Id','Name'),array(
                'class'     => 'col-sm-2 multiple_select multiple_select_filter_single',
                'options'   => null,
            ));
        ?>
        </div>
    </div>
    <div class="col-sm-4">
        <?php         
            echo $form->dropDownList($model,'Id', CHtml::listData($model3,'Id','Nombre'),array(
                'multiple'  => 'multiple',
                'class'     => 'col-sm-2 multiple_select multiple_select_filter',
                'options'   => null,
            ));  
        ?>
    </div>
</div>

javascript:

function makeMultiselect(){
     $("#modal .multiple_select_filter_single").multiselect({
        multiple:       false,
        selectedList:   1,
        open: function () {
            $("input[type='search']:first").focus();
        },
        beforeopen: function(){ $(this).multiselect("widget").width("450px"); },    
        click: function(e){
            if( $(this).multiselect("widget").find("input:checked").length > 1 ){
                return false;
            }
        }
    }).multiselectfilter({
        label:        "Filtro:",
        placeholder:  "",
        autoReset:    false
    });

     $("#modal .multiple_select_filter").multiselect({
        multiple:       true,
        selectedList:   1,
        beforeopen: function(){ $(this).multiselect("widget").width("450px"); },
        open: function () {
            $("input[type='search']:first").focus();
        }
    }).multiselectfilter({
          label:        "Filtro:",
          placeholder:  "",
          autoReset:    false
    });
4

1 回答 1

0

最后我找到了解决方案！我不认为这是最好的，但直到有人（包括我在内）找到更好的解决方案，我才发布这个以帮助任何可能感兴趣的人：

我的解决方案包括在函数末尾添加一个click&focus事件：makeMultiselect()

$(".ui-multiselect-filter input").on( "click",  function() {
   $(this).focus();
});
于 2015-03-12T16:06:35.170 回答