jquery - Submit form details to another site via URL -

i have little "track parcel" widget on site. takes simple code, or tracking number.

i wish pass site, tracking number placed in url. example:

http://www.site.co.uk/en/express/tracking.html?awb=1234&brand=site 

i wish value placed in form field, , build url using code (where 1234 in example above).

i have created form, , function should value field. should open new window going url.

form html:

<h2>track parcel</h2> <form action="trackparcel()" method="get">     <input type="text" class="tracking" name="tracking" placeholder="enter waybill number" />     <input type="submit" /> </form> 

function:

jquery(document).ready(function($) {          function trackparcel(){             event.preventdefault();             console.log('here');             var tracking = $('.tracking').find('input[name="tracking"]').val();             var url = 'http://www.site.co.uk/en/express/tracking.html?awb='+tracking+'&brand=site';             window.open(url, '_blank');         }       }); 

i had thought work correctly. function trackparcel() called when form submitted, preventdefault() stop form being submitted , window.open open new window url have created.

am way off here?

at present, continues submit page (and therefore refreshes) , not open new window.

solution 1:

just directly in html:

<h2>track parcel</h2> <form action="http://www.site.co.uk/en/express/tracking.html" method="get" target="_blank">     <input type="text" class="tracking" name="awb" placeholder="enter waybill number" />     <input type="hidden" name="brand" value="site" />     <input type="submit" /> </form> 

changes:

• make action url of other site's tracking page
• add target="_blank" opens in new window
• change form field name awb matches other site expects
• add hidden field brand=site

since method get, fields put on url query parameters.

---

solution 2:

action="trackparcel()" try open trackparcel() url. if want call trackparcel on form submit, hook submit event of form:

jquery(document).ready(function($) {      $("selector form").on("submit", function(event){         event.preventdefault();         console.log('here');         var tracking = $('.tracking').find('input[name="tracking"]').val();         var url = 'http://www.site.co.uk/en/express/tracking.html?awb='+encodeuricomponent(tracking)+'&brand=site';         window.open(url, '_blank');     }); }); 

note addition of encodeuricomponent.