After building custom jQuery on multiple websites to POST form data to a secondary PHP file for processing, I decided there has to be another way. I wanted to build a JavaScript (jQuery) chunk of code that executes when the document is ready and automatically performs the following functions:
- Put the cursor (focus) in the form’s first input field (if multiple forms on the page, be smart enough to use only the first form).
- Detect all forms and automatically generate the code to POST all of the form elements, via AJAX, to the script defined in the form’s action. Furthermore, use the name of each form field as the key in the POST data.
- Load the results into a div with the id of ‘output’.
- Work for forms that are generated and returned as part of the output (not originally part of the page)