{"id":1442,"date":"2017-04-12T21:30:43","date_gmt":"2017-04-12T12:30:43","guid":{"rendered":"https:\/\/n8finch2024.local\/?p=1442"},"modified":"2017-05-03T21:49:12","modified_gmt":"2017-05-03T12:49:12","slug":"pass-information-one-page-another-forms-javascriptjquery","status":"publish","type":"post","link":"https:\/\/n8finch2024.local\/pass-information-one-page-another-forms-javascriptjquery\/","title":{"rendered":"How to Pass Information from One Page to Another with Forms and JavaScript\/jQuery"},"content":{"rendered":"
This is a quick post, just to share something I learned.<\/p>\n
Recently I got a request to create a simple submit form with a an email input that would direct to another page and take the email address and pre-fill a more complex form with email, name, address, etc.<\/p>\n
Below is the code I used for it.<\/p>\n
<\/p>\n
\r\n\r\n<?php\r\n\/**\r\n* Create a simple shortcode for a newsletter CTA\r\n* Load JS conditionally, only if the page is 'newsletter'\r\n*\/\r\n\r\nadd_action( 'wp', 'n8f_load_rr_signup_cta_scripts_on_newsletter_page');\r\nfunction n8f_load_rr_signup_cta_scripts_on_newsletter_page() {\r\n\r\nif( is_page('newsletter') ) {\r\nadd_action( 'wp_enqueue_scripts', 'register_n8f_rr_signup_cta_scripts' );\r\n}\r\n}\r\n\r\nfunction register_n8f_rr_signup_cta_scripts() {\r\n\r\nwp_enqueue_script( 'n8f_rr_signup_cta_js', get_stylesheet_directory_uri() . '\/js\/newsletter_signup_cta.js', array( 'jquery' ), date("ymd"), true);\r\n\r\n}\r\n\r\nadd_shortcode( 'n8f_rr_signup_cta', 'n8f_rr_signup_cta' );\r\n\r\nfunction n8f_rr_signup_cta() {\r\n$html = '<form action="\/newsletter">\r\n<input type="text" name="email" placeholder="Your email..." \/>\r\n<input type="submit" value="Subscribe"\/>\r\n<\/form>';\r\nreturn $html;\r\n}\r\n\r\n<\/pre>\n<\/p>\n
\r\n\r\n\/**\r\n* Parse the url for an email address\r\n*\/\r\n\r\n(function($) {\r\n\r\n$(document).ready(function() {\r\n\r\nvar queryString = location.search\r\nqueryStart = queryString.indexOf("=") + 1,\r\nquery = queryString.slice(queryStart, queryString.length ),\r\ncleanString = query.replace( \/%40\/, "@");\r\n\r\n$('#control_EMAIL').val(cleanString);\r\n\r\n});\r\n\r\n})(jQuery);\r\n\r\n<\/pre>\n<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
This is a quick post, just to share something I learned. Recently I got a request to create a simple submit form with a an email input that would direct to another page and take the email address and pre-fill a more complex form with email, name, address, etc. Below is the code I used […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[1,37,26],"tags":[],"yoast_head":"\n
How to Pass Information from One Page to Another with Forms and JavaScript\/jQuery | Nate Finch<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n