CODEWITHSUNDEEP
javascriptjqueryparsingquery-string
getaway
getaway

Reputation: 8990

Parsing the url querystring using jquery and inserting the value in a textbox?

post.php?replyto=username&othervariable=value

For example, if I click a link with this url, then I want to take the replyto=username value and insert the value in a textbox using jquery.

function insertParamIntoField(url, param, field) { 
       var anchor = document.createElement('a'), query;
       anchor.value = url;
       query = anchor.query.split('&');

       for(var i = 0, kv; i < query.length; i++) {
          kv = query[i].split('=', 2);
          if (kv[0] == param) {
             field.value = kv[1];
             return;
          }
       }  
    }

    $("a .reply").click(function () {
       insertParamIntoField(this.href, "replyto", $("input .inputField")[0]);
       return false; // prevent default action
    });

this is my html code:

<textarea name="inputField" id="inputField" tabindex="1" rows="2" cols="40"></textarea>
<a class ="reply"  href="home.php?replyto=username">reply</a>

Upvotes: 0

Views: 3361

Answers (6)

Robert Bolton
Robert Bolton

Reputation: 673

Here is some Javascript that should help you. Just take the return value from the getQuerystringNameValue() function and use $("#textboxID").val(returnValue); to assign it to the textbox. 

alert("name1" + " = " + getQuerystringNameValue("name1"));
alert("name2" + " = " + getQuerystringNameValue("name2"));
alert("name3" + " = " + getQuerystringNameValue("name3"));


function getQuerystringNameValue(name)
{
    // For example... passing a name parameter of "name1" will return a value of "100", etc.
    // page.htm?name1=100&name2=101&name3=102

    var winURL = window.location.href;
    var queryStringArray = winURL.split("?");
    var queryStringParamArray = queryStringArray[1].split("&");
    var nameValue = null;

    for ( var i=0; i<queryStringParamArray.length; i++ )
    {           
        queryStringNameValueArray = queryStringParamArray[i].split("=");

        if ( name == queryStringNameValueArray[0] )
        {
            nameValue = queryStringNameValueArray[1];
        }                       
    }

    return nameValue;
}

Upvotes: 0

Cristian Sanchez
Cristian Sanchez

Reputation: 32097

function insertParamIntoField(url, param, field) { 
   var anchor = document.createElement('a'), query;
   anchor.href = url;
   query = anchor.search.substring(1, anchor.search.length).split('&');

   for(var i = 0, kv; i < query.length; i++) {
      kv = query[i].split('=', 2); console.log(kv);
      if (kv[0] == param) {
         field.value = kv[1];
         return;
      }
   }  
}

$("a.reply").click(function () {
   insertParamIntoField(this.href, "replyto", $("textarea.inputField")[0]);
   return false; // prevent default action
});

The insertParamIntoField function will work for any well formed URL (as a string). It works by creating a new anchor DOMElement (but never attaches it to the dom) for that URL and then by using the built in properties of anchor elements (query, hash, etc.) to extract what we want.

If the URL is from an anchor element, we can create a new version of this function that uses that existing anchor rather than creating a new one:

function insertParamIntoField(anchor, param, field) { 
   var query = anchor.search.substring(1, anchor.search.length).split('&'); // anchor is a DOMElement 

   for(var i = 0, kv; i < query.length; i++) {
      kv = query[i].split('=', 2);
      if (kv[0] == param) {
         field.value = kv[1];
         return;
      }
   }  
}

$("a.reply").click(function () {
   insertParamIntoField(this, "replyto", $("textarea.inputField")[0]);
   return false; // prevent default action
});

Upvotes: 1

Robert
Robert

Reputation: 21388

You should be able to grab the ?replyto=username&othervariable=value part with window.location.search, then you have to get the part you want

var print = '?replyto=username&othervariable=value'; // Would be window.location.search in practice
$('textBox').val(print.substr(print.indexOf('replyto=')+8,print.indexOf('&')-(print.indexOf('replyto=')+8)));

​

Upvotes: 0

Kelsey
Kelsey

Reputation: 47726

Using the code from this SO answer (which is great btw) by Artem Barger to get any parameter by name from the query string you could do:

function getParameterByName( name ) 
{ 
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]"); 
    var regexS = "[\\?&]"+name+"=([^&#]*)"; 
    var regex = new RegExp( regexS ); 
    var results = regex.exec( window.location.href ); 
    if(results == null ) 
        return ""; 
    else 
       return decodeURIComponent(results[1].replace(/\+/g, " ")); 
}

Then just insert the value into the textbox:

$("#yourTextBox").val(getParameterByName('replyto'));

Upvotes: 0

JasCav
JasCav

Reputation: 34632

Parsing the URL can be done with a simple function. Use this in your Javascript:

$.urlParam = function(name){
  var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
  return results[1] || 0;
}

You can then call:

$.urlParam('username');

and it will return the user name. So, to actually use it with your text box, do:

$('#textBoxId').val($.urlParam('username'));

Upvotes: 1

gen_Eric
gen_Eric

Reputation: 227190

$('textarea').val("<?php echo $_GET['replyto']");

Upvotes: 0

Related Questions