如何在multiselect jquery插件中获取未经检查的值

时间:2018-06-15 06:09:45

标签: javascript php codeigniter codeigniter-3

我在我的ci应用程序中使用了多选jQuery插件

<div class="controls"><select name="delivery_method_' + cloneCntr + '[]" multiple="multiple" class="dm_list_data">' + delivery_method_options + '</select></div>';

$(function () {
    $('.dm_list_data').multiselect({
        includeSelectAllOption: true,
        buttonWidth: '170px',
        nonSelectedText: 'Select Delivery Method',
    });
});

我已经创建了一个关于变化的功能。在函数中,我没有得到未经检查的值,它只显示选中的值:

$('.dm_list_data').on('change', function() {
    var ischecked= $(this).is(':checked');
    if(!ischecked){
        alert('uncheckd ' + $(this).val());  
    } else {
        alert("checked");
    }
}); 

2 个答案:

答案 0 :(得分:1)

在每个更改设置中,取消选择一些属性并将其添加到数组中。

$('.dm_list_data').on('change', function() {
    var $sel = $(this);
    val = $(this).val();
    $opts = $sel.children();
    prevUnselected = $sel.data('unselected');
    var currUnselected = $opts.not(':selected').map(function() {
        if($("#new-input-"+this.value).length > 0){
            $("#new-input-"+this.value).remove();
        }
        return this.value
    }).get();
    var currSelected = $('.dm_list_data').val();
    $.each(currSelected, function(index, item) {
        if($("#new-input-"+item).length == 0){
            $("#new-options").append("<input type='text' id='new-input-"+item+"' value='"+item+"'>");
        }
    });
});

根据需要更新

添加一个新的div <div id="new-options"></div>

答案 1 :(得分:1)

希望这会对您有所帮助:

请参阅工作示例:https://jsfiddle.net/3b4dqhfc/5/

使用jquery的not来获得所需的结果

$(document).ready(function(){

  $('.dm_list_data').on('change', function() {

   /* use this for unselected value*/
   $('.dm_list_data option').not(':selected').each(function(k,v){
    console.log(k,v.text, v.value);
   });

   /* use this for selected value*/
   $('.dm_list_data :selected').each(function(k,v){
    console.log(k,v.text, v.value);
   });


  }); 
});