How to add a variable to URL of $.ajax({ url : " "});

Question

I want the user to be able to change a part of the URL address to their post code. I have a text box and button which I am hoping will submit the value to the URL.

jQuery:

jQuery(document).ready(function($) {
    $.ajax({ 
        url : "http://SomeAddress.com/" + PostCode + ".json",
        dataType : "jsonp",
        success : function(parsed_json) {

HTML:

<input type="text" id="GetPostCode" />
<button id="SetPostCode">Set This Post Code</button>

jQuery:

$("#SetPostCode").click(function() {
    var PostCode = document.getElementById("GetPostCode").value;
    $("#GetPostCode").val(" ");
    return false;
});

I understand that the line

$.ajax({ 
    url : "http://api.wunderground.com/api/2508132ae0c7601a/geolookup/conditions/q/UK/" + PostCode + ".json",

does not work that way, but I didn't know what else to do. Could someone please show me what I need to do in order for this to work?

Answer 1

jQuery(document).ready(function($) {

   var PostCode=1;
   $.ajax({ url : "http://SomeAddress.com/"+PostCode +".json",
   dataType : "jsonp"
   //.... more stuff
  });


  $("#SetPostCode").click(function() {
     PostCode = document.getElementById("GetPostCode").value;
     $("#GetPostCode").val(" ");
     return false; 
  });

});

Above would work as PostCode is now global to the jQuery and can be accessed anywhere