提交表单后取消选中所有复选框

时间:2017-04-22 13:15:57

标签: javascript php

您好我有一个已经清除其他输入的表单,但我很难使用复选框。有人能帮助我吗这是我的表格输入。

<input type="hidden" name="admissionassessmentfee" value="0">
<input type="hidden" name="admissionassessmentexam" value="0">
<input type="checkbox" class="checkbox-inline" style="width: 25px; height: 17px;" name="admissionassessmentfee" value="1">Assessment Fee
<input type="checkbox" class="checkbox-inline" style="width: 25px; height: 17px;" name="admissionassessmentexam" value="1">Assessment Exam

现在,这是我的javascript。正如您将看到底部我已经有一个clearForm函数,它在提交时清除其他输入。

var manageAdmissionTable;

$(document).ready(function() {

/*
*-------------------------------------------------
* click on the add admission model button
*-------------------------------------------------
*/
$("#addAdmissionModelBtn").unbind('click').bind('click', function() {

    /*remove error messages*/
    $(".form-group").removeClass('has-success').removeClass('has-error');
    $(".text-danger").remove();
    $("#add-admission-messages").html('');

    $("#createAdmissionForm").unbind('submit').bind('submit', function() {
        var form = $(this);
        var formData = new FormData($(this)[0]);
        var url = form.attr('action');
        var type = form.attr('method');

        $.ajax({
            url : url,
            type : type,
            data: formData,
            dataType: 'json',
            cache: false,
            contentType: false,
            processData: false,
            async: false,
            success:function(response) {                    

                if(response.success == true) {                      
                    $("#add-admission-messages").html('<div class="alert alert-success alert-dismissible" role="alert">'+
                  '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>'+
                  '<strong> <span class="glyphicon glyphicon-ok-sign"></span> </strong>'+response.messages+
                '</div>');

                    manageAdmissionTable.ajax.reload(null, false);
                    $('.form-group').removeClass('has-error').removeClass('has-success');
                    $('.text-danger').remove();

                    clearForm(); // THE CLEAR FORM WHEN SUBMITTED
                }   
                else {                                  
                    if(response.messages instanceof Object) {                           
                        $.each(response.messages, function(index, value) {
                            var key = $("#" + index);

                            key.closest('.form-group')
                            .removeClass('has-error')
                            .removeClass('has-success')
                            .addClass(value.length > 0 ? 'has-error' : 'has-success')
                            .find('.text-danger').remove();                         

                            key.after(value);

                        });
                    }
                    else {                          
                        $("#add-admission-messages").html('<div class="alert alert-warning alert-dismissible" role="alert">'+
                      '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>'+
                      '<strong> <span class="glyphicon glyphicon-exclamation-sign"></span> </strong>'+response.messages+
                    '</div>');                      
                    }                           
                } // /else
            } // /success
        }); // /ajax

        return false;
    }); 
}); // /click on the add admission button   
});

function clearForm() // THE CLEAR FORM FUNCTION
{
 $('input[type="text"]').val('');
 $('select').val('');
 $('input[type="date"]').val('');
 $(".fileinput-remove-button").click(); 
}

1 个答案:

答案 0 :(得分:0)

使用jQuery 1.9.1+这样的东西?将以下内容添加到您的函数clearForm()

$('input[type="checkbox"]').prop('checked', false); // Uncheck

$(document).ready(function() {
  $('#test').on('click', function() {
    clearForm();
  });
});

function clearForm() // THE CLEAR FORM FUNCTION
{
  $('input[type="text"]').val('');
  $('input[type="checkbox"]').prop('checked', false); // Uncheck
  $('select').val('');
  $('input[type="date"]').val('');
  $(".fileinput-remove-button").click();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<input type="hidden" name="admissionassessmentfee" value="0">
<input type="hidden" name="admissionassessmentexam" value="0">
<input type="checkbox" class="checkbox-inline" style="width: 25px; height: 17px;" name="admissionassessmentfee" value="1">Assessment Fee
<input type="checkbox" class="checkbox-inline" style="width: 25px; height: 17px;" name="admissionassessmentexam" value="1">Assessment Exam


<button id="test">
  TEST SUBMIT
</button>