Submit a form using jQuery

Question

I want to submit a form using jQuery  Can someone provide the code  a demo or an example link

User · Answer

If the button is located between the form tags  I prefer this version       my-button   click function  event        var  target      event target         target closest  form   submit

User · Answer

IE trick for dynamic forms       someform   find  input select textarea   serialize

User · Answer

you could do it like this        myform   bind  submit   function

User · Answer

You will have to use     formId   submit     You would generally call this from within a function   For example    lt input type  button  value  Submit form  onClick  submitDetailsForm      gt    lt script language  javascript  type  text javascript  gt      function submitDetailsForm                formId   submit           lt  script gt    You can get more information on this on the Jquery website

User · Answer

form first   submit      See events submit

User · Answer

I recommend a generic solution so you don t have to add the code for every form  Use the jquery form plugin  http   jquery malsup com form   and add this code     function       form ajax submit   submit function           this  ajaxSubmit                  validation and other stuff         return false

User · Answer

For information if anyone use      formId   submit      Do not something like this    lt button name    submit  gt    It took many hours to find me that submit   won t work like this

User · Answer

It depends on whether you are submitting the form normally or via an AJAX call  You can find lots of information at jquery com  including documentation with examples  For submitting a form normally  check out the submit   method to at that site  For AJAX  there are many different possibilities  though you probably want to use either the ajax   or post   methods  Note that post   is really just a convenient way to call the ajax   method with a simplified  and limited  interface   A critical resource  one I use every day  that you should bookmark is How jQuery Works  It has tutorials on using jQuery and the left-hand navigation gives access to all of the documentation   Examples   Normal     form myForm   submit      AJAX     input submitButton   click  function           post   some-url      form myForm   serialize    function data                    do something with response from server                   json     I expect a JSON response                input submitButton   click  function           ajax           url   some-url           type   post           dataType   json           data     form myForm   serialize            success  function data                              do something with the data                                     Note that the ajax   and post   methods above are equivalent  There are additional parameters you can add to the ajax   request to handle errors  etc

User · Answer

jQuery  a id atag    click  function         jQuery   form-id   submit                         OR        jQuery this  parents   form-id   submit

User · Answer

The solutions so far require you to know the ID of the form    Use this code to submit the form without needing to know the ID   function handleForm field          field  closest  form   submit        For example if you were wanting to handle the click event for a button  you could use      buttonID   click function         handleForm this

User · Answer

Note that if you already installed a submit event listener for your form  the innner call to submit     jQuery    lt form-id gt    submit  function e        e preventDefault           maybe some validation in here     if    lt form-is-valid gt    jQuery    lt form-id gt    submit          won t work as it tries to install a new event listener for this form s submit event  which fails   So you have to acces the HTML Element itself  unwrap from jQquery  and call submit   on this element directly       jQuery    lt form-id gt    submit  function e          e preventDefault             note the  0  array access        if    lt form-is-valid gt    jQuery    lt form-id gt    0  submit

User · Answer

In jQuery I would prefer the following       form-id   submit     But then again  you really don t need jQuery to perform that task - just use regular JavaScript   document getElementById  form-id   submit

User · Answer

when you have an existing form  that should now work with jquery - ajax post now you could    hang onto the submit - event of your form prevent default functionality of submit do your own stuff    function           hang on event of form with id myform         myform   submit function e               prevent Default functionality         e preventDefault               get the action-url of the form         var actionurl   e currentTarget action             do your own request an handle the results           ajax                   url  actionurl                  type   post                   dataType   application json                   data      myform   serialize                    success  function data                            do something with the data                                                   Please note that  in order for the serialize   function to work in the example above  all form elements need to have their name attribute defined   Example of the form    lt form id  myform  method  post  action  http   example com do recieve request  gt    lt input type  text  size  20  value  default value  name  my input field  gt        lt  form gt     PtF - the data is submitted using POST in this sample  so this means you can access your data via     POST  dataproperty1        where dataproperty1 is a  variable-name  in your json   here sample syntax if you use CodeIgniter     pdata    this- gt input- gt post      prop1    pdata  prop1      prop1    pdata  prop2

User · Answer

I have also used the following to submit a form  without actually submitting it  via Ajax     jQuery get  process form php      form id   serialize             function           alert  Okay

User · Answer

Note that in Internet Explorer there are issues with dynamically created forms  A form created like this will not submit in IE  9    var form       lt form method  post  action   test Delete   gt                    lt input type  hidden  name  id  value      myid      gt  lt  form gt       form  submit      To get it working in IE create the form element and attach it before submitting like so   var form   document createElement  form      form  attr  action     test Delete           attr  method    post      form  html   lt input type  hidden  name  id  value      myid        gt     document body appendChild form     form  submit    document body removeChild form     Creating the form like in example 1 and then attaching it will not work - in IE9 it throws a JScript error DOM Exception  HIERARCHY REQUEST ERR  3   Props to Tommy W   https   stackoverflow com a 6694054 694325

User · Answer

function  form submit form id filename         post filename       form id  serialize    function data           alert data               It will post the form data on your given file name via AJAX

User · Answer

You can also use the jquery form plugin to submit using ajax aswell   http   malsup com jquery form

User · Answer

Use it to submit your form using jquery  Here is the link http   api jquery com submit    lt form id  form  method  post  action     gt       lt input type  text  id  input  gt       lt input type  button  id  button  value  Submit  gt   lt  form gt    lt script type  text javascript  gt    document  ready function               button    click function                  form    submit                 lt  script gt

User · Answer

My approach was slightly different  change the button into submit button and then click    quot  submit quot   click function  event        this  attr  quot type quot    quot submit quot        this  click

User · Answer

From the manual  jQuery Doc     form first   submit

User · Answer

you could use it like this          formId   submit      OR  document formName submit

User · Answer

this will send a form with preloader    var a     yourform   serialize      ajax       type  post       url  receiver url       data a      beforeSend function            launchpreloader               complete function            stopPreloader               success function result            alert result               i have some trick to make a form data post reformed with random method http   www jackart4 com article html

[jquery] Submit a form using jQuery

Examples related to jquery