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

Question

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

dont use id selector to reset the value of checkbox. – rajesh Oct 20 '16 at 13:49 — rajesh, Oct 20 '16 at 13:49

score 0 · Answer 1 · edited May 23 '17 at 10:27

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?

edited May 23 '17 at 10:27

Community

1
1

answered Oct 20 '16 at 13:23

nomadIND

1
3

score 0 · Answer 2 · answered Oct 20 '16 at 13:46

0

To reset the checkbox field use below jquery,

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

To reset the select list use below jquery,

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

To reset the search text box use below jquery,

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

answered Oct 20 '16 at 13:46

rajesh

1,475
10
23

Thank for your help.That helps me. – Anus G Oct 21 '16 at 05:58
But i had a problem,for example : if – Anus G Oct 21 '16 at 05:59
Thank for Search… 1.AB 2.BC 3.gvj If I search for a..the table will display like a 1.AB If I click reset…. Until I press Enter in the search… It will display like that. Search… 1.AB 2.BC 3.gvj your help.That helps me.But i had a problem,for example : if – Anus G Oct 21 '16 at 06:03

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

2 Answers2