发表新帖
发表新帖

How to reset a form using jQuery with .reset() method

前端 未结
关注
16 1187
清酒与你
清酒与你 2020-11-22 17:28

I had working code that could reset my form when I click on a reset button. However after my code is getting longer, I realize that it doesn\'t work anymore.
相关标签:
16条回答
  • 我寻月下人不归
    2020-11-22 17:39

    A quick reset of the form fields is possible with this jQuery reset function.

    when you got success response then fire below code.

    $(selector)[0].reset();

    0 讨论(0)
  • 傲寒
    2020-11-22 17:40

    Here is simple solution with Jquery. It works globally. Have a look on the code.

    $('document').on("click", ".clear", function(){
   $(this).closest('form').trigger("reset");
})

    Add a clear class to a button in every form you need to reset it. For example: 

    <button class="button clear" type="reset">Clear</button>
    0 讨论(0)
  • 走了就别回头了
    2020-11-22 17:41

    I've finally solve the problem!! @RobG was right about the form tag and table tag. the form tag should be placed outside the table. with that, 

    <td><input type="reset" id="configreset" value="Reset"></td>

    works without the need of jquery or anything else. simple click on the button and tadaa~ the whole form is reset ;) brilliant!

    0 讨论(0)
  • 长发绾君心
    2020-11-22 17:42

    http://jsfiddle.net/8zLLn/

      $('#configreset').click(function(){
        $('#configform')[0].reset();
  });

    Put it in JS fiddle. Worked as intended.

    So, none of the aforementioned issues are at fault here. Maybe you're having a conflicting ID issue? Is the click actually executing?

    Edit: (because I'm a sad sack without proper commenting ability) It's not an issue directly with your code. It works fine when you take it out of the context of the page that you're currently using, so, instead of it being something with the particular jQuery/javascript & attributed form data, it has to be something else. I'd start bisecting the code around it out and try to find where it's going on. I mean, just to 'make sure', i suppose you could...

    console.log($('#configform')[0]);

    in the click function and make sure it's targeting the right form...

    and if it is, it has to be something that's not listed here.

    edit part 2: One thing you could try (if it's not targeting it correctly) is use "input:reset" instead of what you are using... also, i'd suggest because it's not the target that's incorrectly working to find out what the actual click is targeting. Just open up firebug/developer tools, whathave you, toss in 

    console.log($('#configreset'))

    and see what pops up. and then we can go from there.

    0 讨论(0)
  • 心在旅途
    2020-11-22 17:42

    jQuery does not have reset() method; but native JavaScript does. So, convert the jQuery element to a JavaScript object by either using :

    $("#formId")[0].reset();

$("#formId").get(0).reset();

    We may simply use Javascript code

    document.getElementById("formid").reset();
    0 讨论(0)
  • Happy的楠姐
    2020-11-22 17:44

    You can just add an input type = reset with an id = resetform like this

    <html>
<form>
<input type = 'reset' id = 'resetform' value = 'reset'/>
<!--Other items in the form can be placed here-->
</form>
</html>

    then with jquery you simply use the .click() function on the element with the id = resetform as follows

    <script> 
$('#resetform').click();
</script>

    and the form resets Note: You can also hide the reset button with id = resetform using your css

    <style>
#resetform
{
display:none;
}
</style>
    0 讨论(0)
 看不清?
提交回复
热议问题