Submit form using AJAX and jQuery

Question

It seems like this should be something built into jQuery without the need for more than a few lines of code  but I can t find the  simple  solution   Say  I have an HTML form    lt form method  get  action  page html  gt       lt input type  hidden  name  field1  value  value1    gt       lt input type  hidden  name  field2  value  value2    gt       lt select name  status  gt            lt option value    gt  lt  option gt            lt option value  good  gt Good lt  option gt            lt option value  bad  gt Bad lt  option gt       lt  select gt   lt  form gt    When someone changes the select field  I would like to submit the form using ajax to update the database   I thought there would be some way to do the following without manually creating the values attributes  just send them all  like      select   change function          get  page html     serializeForm           What am I missing

User · Answer

First give your form an id attribute  then use code like this     document  ready  function       var form       my awesome form       form find  select first   change  function           ajax          type   POST         url  form attr   action           data  form serialize          success  function  response             console log  response                                    So this code uses  serialize   to pull out the relevant data from the form  It also assumes the select you care about is the first one in the form   For future reference  the jQuery docs are very  very good

User · Answer

This is what ended up working      select   change function          get   page html       this  parent  form   find   input   serialize

User · Answer

There is a nice form plugin that allows you to send an HTML form asynchroniously     document  ready function              myForm1   ajaxForm           or      select   change function            myForm1   ajaxSubmit          to submit the form immediately

User · Answer

There is a nice form plugin that allows you to send an HTML form asynchroniously     document  ready function              myForm1   ajaxForm           or      select   change function            myForm1   ajaxSubmit          to submit the form immediately

User · Answer

There is a nice form plugin that allows you to send an HTML form asynchroniously     document  ready function              myForm1   ajaxForm           or      select   change function            myForm1   ajaxSubmit          to submit the form immediately

User · Answer

This is what ended up working      select   change function          get   page html       this  parent  form   find   input   serialize

User · Answer

First give your form an id attribute  then use code like this     document  ready  function       var form       my awesome form       form find  select first   change  function           ajax          type   POST         url  form attr   action           data  form serialize          success  function  response             console log  response                                    So this code uses  serialize   to pull out the relevant data from the form  It also assumes the select you care about is the first one in the form   For future reference  the jQuery docs are very  very good

User · Answer

There is a nice form plugin that allows you to send an HTML form asynchroniously     document  ready function              myForm1   ajaxForm           or      select   change function            myForm1   ajaxSubmit          to submit the form immediately

User · Answer

First give your form an id attribute  then use code like this     document  ready  function       var form       my awesome form       form find  select first   change  function           ajax          type   POST         url  form attr   action           data  form serialize          success  function  response             console log  response                                    So this code uses  serialize   to pull out the relevant data from the form  It also assumes the select you care about is the first one in the form   For future reference  the jQuery docs are very  very good

User · Answer

First give your form an id attribute  then use code like this     document  ready  function       var form       my awesome form       form find  select first   change  function           ajax          type   POST         url  form attr   action           data  form serialize          success  function  response             console log  response                                    So this code uses  serialize   to pull out the relevant data from the form  It also assumes the select you care about is the first one in the form   For future reference  the jQuery docs are very  very good

[jquery] Submit form using AJAX and jQuery

Examples related to jquery

Examples related to ajax

Examples related to serialization