How to reset the checkbox, search text box and select list?

时间:2016-10-20 12:54:42

标签: javascript jquery

Here is my html page:

<form id="userworklog"  action="#" method="post">
    <div id="userlogs" class="userlogs">
        <table id="worklog">
            <tr>
                <th>Strt date</th>
                <th>Projects</th>
                <th>Charge# Field</th>
                <th>Employee Name</th>
            </tr>
            <tr>
                <td>
                    <input type= "date" id="startdate" name="startdate"  class="required">
                </td>
                <td>
                    <input type="text" name="SearchBox" id="SearchBox" placeholder="Search...." />  
                    <br /> 
                    <select  id="projectsList" class="textFld" multiple="multiple"/>
                </td>
                <td>
                    <input type="text"  id="comboBox" placeholder="Search.." />
                    <ul id="userList"  class="nobull" style="width: 300px; height: 80px;list-style: none; overflow: auto">
                </td>
            </tr>
        </table>

I have submit and reset button. We are dynamically loading the data and populating to html. When I submit reset the input " start date" is only resetting. To reset the check list I used jQuery

$("#reset").on("click", function () {
    $("#checkbox").attr("checked", false);
});

I could reset the search of project and employee .unless I press enter the project list data is not viewed in the html

2 个答案:

答案 0 :(得分:0)

$("#reset).on("click", function(){
    $('#checkbox').prop('checked', false);
})

This should reset the checkbox to false. Please take a look here too: Setting "checked" for a checkbox with jQuery?

答案 1 :(得分:0)

要重置复选框字段,请使用以下jquery,

$('input:checkbox').removeAttr('checked');

要重置选择列表,请使用以下jquery,

$("#projectsList").prop('selectedIndex',0);

要重置搜索文本框,请使用以下jquery,

$("#SearchBox").val('');