codeigniter SumoSelect的全选选项与选择下拉列表中的其他选项重叠

mcdcgff0  于 2022-12-07  发布在  其他
关注(0)|答案(3)|浏览(171)

我在CodeIgniter应用程序中有一个SumoSelect选择下拉菜单,其中select all选项的高度比其他项小,因此,select all选项与下拉列表中的其他选项重叠。我已经尝试使用jQuery增加select-all选项元素的高度,但我认为<option>的高度不能手动修改。那么请告诉我们如何解决这个重叠的问题?

代码:

<select name="type" id="type" multiple="multiple" placeholder="Select a type" class="form-control SlectBox">                          
    <?php foreach($types as $type) { ?>
        <option>$type</option>
    <?php } ?>
</select>

<script>
    $(document).ready(function() {
        window.asd = $('.SlectBox').SumoSelect({ 
            csvDispCount: 3,
            selectAll: 1,
            captionFormat: '{0} types selected!',
            captionFormatAllSelected:'All {0} types selected!'
        }); 
        <?php if(count(array_filter($Type_list))==0){?>
            $('select.SlectBox')[0].sumo.selectAll();
        <?php } ?>      
    });
</script>

重叠问题:

s4chpxco

s4chpxco1#

这里有一个解决方法:捕获sumo select的opening事件,用jquery动态设置第一个元素的高度。

$('#EmployeeType').on('sumo:opening', function () {

    $('.select-all').css('height', '35px');

});

n3schb8v

n3schb8v2#

添加此css类并调整高度和填充。form-group〉. SumoSelect.open〉.optWrapper〉.select-all {高度:50 px;填充:6像素x 35像素;}

vbopmzt1

vbopmzt13#

作为Firefox中的一个快速修复,这个解决方案对我很有效。

.SumoSelect .select-all {
  display: table-cell;
}

相关问题