Jim Jim - 16 days ago 6
Javascript Question

How to reset forms elements (input,select,textarea,etc.) on events using jQuery

I need to reset forms elements after click span for example.

Is there a method to reset the from by jQuery without select each element and remove the attribute value.

Some of the elements not having attribute value like textarea or radio

And some like button I don't want to remove the value from it.

I want use jQuery to use the reset on other events

Code for example http://jsfiddle.net/pgNrF/

<input type="button" value="Input Button">
<input type="checkbox">
<input type="hidden">
<textarea></textarea>
<span>Reset</span>

Answer

This is already built in if you wrap those form elements in an actual form:

<form id="myform">  
    <input type="button" value="Input Button">
    <input type="checkbox">
    <input type="file">
    <input type="hidden">
    <input type="image">
    <input type="password">
    <input type="radio">
    <input type="submit">
    <input type="text">
    <select>
        <option>Option1</option>
        <option>Option2</option>
        <option>Option3</option>
    </select>

    <textarea></textarea>
    <button type="button">Button</button> 

    <button type="reset">Reset</span>
</form>

FIDDLE

If you just have to use jQuery:

$('span').click(function() {
    $('#myform').get(0).reset();
});

FIDDLE

Comments