在jQuery中启用/禁用复选框以及表单在dropdownlist上提交更改事件

我已经使用jQuery的dropdownlist onchange方法提交了表单，该方法运行良好。我还想在选择值时使用相同的dropdownlist onchange事件启用复选框和表单提交

我的表格是

{!! Form::open( array('route' => array('main.customerequipment.search',$customer_id), 'id'=>'equipment_form', 'name'=>'equipment_form', 'data-toggle'=>"validator") ) !!}

    {!! Form::select('filter_by', @$owner_name,'', array('id'=>'filter_by', 'placeholder'=>trans('main.all'), 'class' => 'form-control')) !!}

{!! Form::close() !!}

下面是我的代码：

$("#filter_by").on("change", function () {
    localStorage.realOwnerFilter = $('select[name^="filter_by"] option:selected').val();
    $("#equipment_form").submit();
    if($(this).val() == '')
    { 
        $("#download_certificate").attr('disabled','disabled');
        $(".select_all").attr('disabled','disabled');
        $(".select_particular").attr('disabled','disabled');
        $(".select_all").prop('checked',false);
        $(".select_particular").prop('checked',false);
    }   
    else
    {
        $(".select_all").removeAttr("disabled");
        $(".select_particular").removeAttr("disabled");
    }
});     

注意：当我排除以下行时，启用/禁用复选框可以正常工作

$("#equipment_form").submit();

---

当我包括那一行时，我的复选框不能正常工作。我想问题在于我不太确定的表单提交。

在您的表单中添加

onSubmit

：

<form id="equipment_form" onSubmit="mySubmit(event)">

mySubmit函数将是：

function mySubmit(event) {
if ($("#filter_by").val() == '') {
    $("#download_certificate").attr('disabled', 'disabled');
    $(".select_all").attr('disabled', 'disabled');
    $(".select_particular").attr('disabled', 'disabled');
    $(".select_all").prop('checked', false);
    $(".select_particular").prop('checked', false);
} else {
    $(".select_all").removeAttr("disabled");
    $(".select_particular").removeAttr("disabled");
}
event.preventDefault();
}

---

我使用下面给出的代码修复了上述问题：

我只是在文档中写了以下几行。ready（function（））

---

你试过这行“$”（“#设备_表单”）.submit（）；”吗在if-else块之后？是的。。但也有同样的问题（试试这一个

$（“#设备_表单”）.unbind（）.submit（）

。如果它工作，那么表单将绑定另一个事件。我用你的代码尝试了。同样的问题发生了。你能在问题中添加表单详细信息吗？当我使用你的代码时，它声明了以下错误，“未捕获引用错误：e未定义”添加事件后，它会启用复选框，但不会进行表单提交。我想可能是我们使用了preventDefault（）。您怎么说？是的，preventDefault（）将停止表单提交。但我希望同时启用复选框和表单提交，当下拉列表选择了值时，这可能有点过分，但您可以使用cookie进行此操作。在表单提交上，设置cookie，并在$（文档）上设置cookie。ready（）检查cookie值，禁用/启用复选框并重置cookie值。

function mySubmit(event) {
if ($("#filter_by").val() == '') {
    $("#download_certificate").attr('disabled', 'disabled');
    $(".select_all").attr('disabled', 'disabled');
    $(".select_particular").attr('disabled', 'disabled');
    $(".select_all").prop('checked', false);
    $(".select_particular").prop('checked', false);
} else {
    $(".select_all").removeAttr("disabled");
    $(".select_particular").removeAttr("disabled");
}
event.preventDefault();
}

document.ready(function(){        
    var real_owner = localStorage.realOwnerFilter;
    if(real_owner =='' || real_owner == undefined )
    {
        $(".checkboxToggle").hide();
        $(".realOwner").hide();
        $(".select_particular").hide();
        $("#download_certificate").attr('disabled','disabled');
    }
    else 
    {
        $(".checkboxToggle").show();
        $(".realOwner").show();
        $(".select_particular").show();
    } 
});

$("#filter_by").on("change", function () {
    localStorage.realOwnerFilter = $('select[name^="filter_by"] option:selected').val();
    $("#equipment_form").submit();
});