I am using the below code using Jquery to set my form fields

 $("#frmlogin").reset()

above is the code I use to reset the fields in the below form

<form  name='frmlogin' method='POST' id="login_form" style="margin:0 auto; margin-top:50px; width: 40%; height:300px; text-align:center;">

                        <input class="oFormJumbo oFormMed oInputText" type="text" name="requiredLogin" placeholder="Login Id" AUTOCOMPLETE=OFF />
                        <div class="cleaner h10"></div>
                        <input class="oFormJumbo oFormMed oInputText "  type="password" value="" name="password" placeholder="Password"  AUTOCOMPLETE=OFF onfocus="changetoUpperCase(document.frmlogin.requiredLogin.value);" />
                        <div class="cleaner h10"></div>
                        <a href="javascript:fp();">Forgot Password?</a>
                        <div class="cleaner"></div>
                        <input style="margin-left:0px; "   class="submit_btn float_l" type="button" value="Sign In" name="Sign In" onClick="javascript:func_get_data();"/>
                        <input style="margin-left: 200px; "  class="submit_btn float_r" type="button" value="Reset" id="reset" name="reset"   onclick="javascript:Reset()"/>

 </form>

For some reason the code is not working. The JavaScript is throwing the following exception

TypeError: $("#frmlogin").reset is not a function
[Break On This Error]   

$("#login_form").reset()

Can anyone Tell me Why is it not working?. I have included Jquery.js.

According to Adils suggestion I even tried

*$("#login_form")[0].reset()*

now it gives

TypeError: $("#frmlogin")[0] is undefined
[Break On This Error]   

$("#frmlogin")[0].reset()

What is it I am missing?

I tried every code suggested bellow except Amit Agrawal since I want to use Jquery. None wok. I know my code to rest is proffer. There is something that I am missing in the form

I am using the below code using Jquery to set my form fields

 $("#frmlogin").reset()

above is the code I use to reset the fields in the below form

<form  name='frmlogin' method='POST' id="login_form" style="margin:0 auto; margin-top:50px; width: 40%; height:300px; text-align:center;">

                        <input class="oFormJumbo oFormMed oInputText" type="text" name="requiredLogin" placeholder="Login Id" AUTOCOMPLETE=OFF />
                        <div class="cleaner h10"></div>
                        <input class="oFormJumbo oFormMed oInputText "  type="password" value="" name="password" placeholder="Password"  AUTOCOMPLETE=OFF onfocus="changetoUpperCase(document.frmlogin.requiredLogin.value);" />
                        <div class="cleaner h10"></div>
                        <a href="javascript:fp();">Forgot Password?</a>
                        <div class="cleaner"></div>
                        <input style="margin-left:0px; "   class="submit_btn float_l" type="button" value="Sign In" name="Sign In" onClick="javascript:func_get_data();"/>
                        <input style="margin-left: 200px; "  class="submit_btn float_r" type="button" value="Reset" id="reset" name="reset"   onclick="javascript:Reset()"/>

 </form>

For some reason the code is not working. The JavaScript is throwing the following exception

TypeError: $("#frmlogin").reset is not a function
[Break On This Error]   

$("#login_form").reset()

Can anyone Tell me Why is it not working?. I have included Jquery.js.

According to Adils suggestion I even tried

*$("#login_form")[0].reset()*

now it gives

TypeError: $("#frmlogin")[0] is undefined
[Break On This Error]   

$("#frmlogin")[0].reset()

What is it I am missing?

I tried every code suggested bellow except Amit Agrawal since I want to use Jquery. None wok. I know my code to rest is proffer. There is something that I am missing in the form

• javascript
• jquery
• css
• forms

• possible duplicate of How to reset a form using jQuery with .reset() method – Patsy Issa Commented Aug 3, 2015 at 13:12

6 Answers 6

Is there some reason you've overlooked the reset input element?

http://jsfiddle/BhTv5/

<input type="reset" />

You are using jQuery object to call reset on, use DOM object to call reset, you can convert jQuery object to DOM object using indexer.

Change

$("#login_form").reset()

To

$("#login_form")[0].reset()

Edit based on ments, The other cause of problem is id and name of your reset button. Surprisingly if there is any input with id or name reset then form.reset() function stops working. Change the id and name of reset button and the above code will work.

Live Demo

Change

<input style="margin-left: 200px; "  class="submit_btn float_r" type="button" value="Reset" id="reset" name="reset"   onclick="javascript:Reset()/>

To

<input style="margin-left: 200px; "  class="submit_btn float_r" type="button" value="Reset" id="myreset" name="myreset" />

Binding event with button

$('#myreset').click(function () {   
    $("#login_form")[0].reset();
});

try this code u won't get the type error.you declared id is wrong you declared the form Name not id try to use the id and reset the form.

document.getElementById("login_form").reset();

(OR)

  $("#login_form").reset();

reset is javascript method and needs DOM object

it should be

$("#login_form")[0].reset()

You have to get the name with attribute selector:

$('form[name="frmlogin"]').reset();

or with id:

$('#login_form').reset();

Your code breaks because you are not referencing the form with correct property.

Using JavaScript

document.getElementById("login_form").reset();//Use the id of the form

Using jQuery

("#login_form").reset();