从Select2删除项目不起作用

时间:2014-09-09 22:22:25

标签: javascript jquery jquery-select2

我有一个下拉列表(选择),我应用.select2()。现在,我尝试通过标记/取消标记复选框从下拉列表中删除/添加选项,但它无法正常工作。这是HTML代码:

<input type="checkbox" value="1" class="lives_in_css" name="orders[lives_in_ccs]" id="orders_lives_in_ccs">

<select class="shipping_from form-control toSelect2 select2-offscreen" required="required" name="orders[shipping_from]" id="orders_shipping_from" tabindex="-1" title="" data-bv-field="orders[shipping_from]">
    <option selected="selected" value="">-- SELECCIONAR --</option>
    <option value="MRW">MRW - COBRO EN DESTINO</option>
    <option value="DOMESA">DOMESA - COBRO EN DESTINO</option>
    <option value="ZOOM">GRUPO ZOOM - COBRO EN DESTINO</option>
</select>

这是我为此目的制作的jQuery代码:

$('.lives_in_ccs').click(function() {
    if (this.checked) {
        $(".shipping_from option[value='MRW']").remove();
        $(".shipping_from").select2("val", "DOMESA");
    } else {
        $(".shipping_from").prepend('<option value="MRW">MRW - COBRO EN DESTINO</option>');
        $(".shipping_from").select2("val", "MRW");
    }

    console.log(this.checked);

    $(".secure_shipping").toggle(this.checked);
});

我的代码有什么问题? Here是jsFiddle与

一起玩

1 个答案:

答案 0 :(得分:4)

您是要分离给定的列表项,然后在取消选中该复选框时重新附加它?我不熟悉select2,但以下是这样的:

$(document).ready(function () {
    $('.toSelect2').select2();
    var detachedMember;
    $('.lives_in_css').click(function () {
        if (this.checked) {
            detachedMember = $('option[value="MRW"]').detach();
        } else {
            $('option[value=""]').after(detachedMember);
        }
        $(".secure_shipping").toggle(this.checked);
    });
});

这里是fiddle