1

I'm new to jquery

I'm working on a form data html,

now i need to reset the data on click on the reset button and also need to transfer the form data to email on click on submit button.

Can anyone help me in solving this??

Before Posting the question I have gone through the link which Pierre C. has updated and my question is different from that question and even how to add /can we add "type" attribute in anchor tag.??

here is the html:

<form id="form" method="post">
  <fieldset>
    <label>
      <input type="text" value="Name">
    </label>
    <label>
      <input type="text" value="Email">
    </label>
    <label>
      <input type="text" value="Phone">
    </label>
    <label>
      <textarea>Message</textarea>
    </label>
    <div class="btns">
      <a href="#" class="button">Clear</a>
      <a href="#" class="button" onClick="document.getElementById('form').submit()">Send</a>
    </div>
  </fieldset>
</form>
HassanUsman
  • 1,787
  • 1
  • 20
  • 38
Bhairav
  • 87
  • 12
  • 2
    `` ? – Rayon Apr 15 '16 at 07:06
  • I am using some cufon style of css for showing the clear and submit in a design point of view.so I didnt go for that option... – Bhairav Apr 15 '16 at 07:09
  • 1
    Possible duplicate of [How to reset a form using jQuery with .reset() method](http://stackoverflow.com/questions/16452699/how-to-reset-a-form-using-jquery-with-reset-method) – Pierre C. Apr 15 '16 at 07:12
  • Well that's one duplicate question, but there is two. @Bhairav You want to send the form as an email, do you? *mail id* got me confused. – Pierre C. Apr 15 '16 at 07:16
  • @PierreC., Before posting the question i have gone through it but what rayon was suggesting is similar to that question but here how would I write type attribute in anchor tag?? – Bhairav Apr 15 '16 at 07:22
  • Yup I need to send the form data to my personal email. – Bhairav Apr 15 '16 at 07:23
  • If you look at the link I provided as a duplicate, you will see the reset is done using jQuery. No need for `type='reset'`. Make a javascript function and add an `onclick` attribute to your *Clear* link. – Pierre C. Apr 15 '16 at 07:28
  • Still it is not working ..Do I need to add more plugins for now i am using jquery-1.9.1.min.js – Bhairav Apr 15 '16 at 07:30
  • @pierre C. Thanks for the javascript solution "clear" is working fine and how about sending the form data to email.?? – Bhairav Apr 15 '16 at 07:37
  • I guess there is no *javascript only* way of doing this. You could make a PHP script to do this and then POST to your data to the PHP server using AJAX. – Pierre C. Apr 15 '16 at 07:51
  • By the way, searching for *send mail javascript* in SO would have gave you the same answer. – Pierre C. Apr 15 '16 at 07:52
  • try this – HassanUsman Apr 15 '16 at 07:56

1 Answers1

0

To clear all the data within a form, all you have to do is add an 

<input type="reset" name="reset" value="Reset"></input>

However, reset buttons are annoying and no one ever uses them, so I suggest you just leave that. With regards to sending the form, the way I would do it is write this app in ASP.NET MVC and just put the mail logic in the controller, or create an API for your app, then create an Ajax POST on the button click using the form data as API parameters.

TechnicalTophat
  • 1,655
  • 1
  • 15
  • 37