Retrive value from url in jquery

Posted by Klbaiju under jQuery on 3/28/2015 | Points: 10 | Views : 381 | Status : [Member] | Replies : 3
Hi ,

in my application i want to load a page using jquery and same time i want to pass a value and return a result.

i used following query

var id= $('#ContentPlaceHolder1_txtstid').val();
$('#disp').show();
$('#disp').load("GuardianForm.aspx?id="+id);
.

my requirement is in guardianForm.aspx ,retrive value of id.

as per the value of id i want to return a result.

following is code in GuardianForm.aspx
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "GuardianForm.aspx/BindGuardian",
data: "{id:'"+id+"'}",
dataType: "json",
success: function (data) {
$('#txttitle').val(data.d[0].title);
$('#txtsname').val(data.d[0].surname);


}
});


How it is possible

Regards
Baiju




Responses

Posted by: A2H on: 3/28/2015 [Member] [MVP] Silver | Points: 25

Up
0
Down
I guess you need to read the values from Querystring and then assign it in your Javascript function. if that is the case then you can use the below code to get the values from querystring in Javascript.

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


then you can use the above function in your code like given below
//get the ID value
var id = getParameterByName("id");
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "GuardianForm.aspx/BindGuardian",
data: "{id:'" + id + "'}",

dataType: "json",
success: function (data) {
$('#txttitle').val(data.d[0].title);
$('#txtsname').val(data.d[0].surname);
}
});


Thanks,
A2H
My Blog

Klbaiju, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: A2H on: 3/28/2015 [Member] [MVP] Silver | Points: 25

Up
0
Down
You can check this link for more details
http://onetarek.com/javascript-and-jquery/javascript-how-to-get-query-string-parameter-value-from-current-page-url/

Thanks,
A2H
My Blog

Klbaiju, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Rajnilari2015 on: 3/31/2015 [Member] [Microsoft_MVP] [MVP] Platinum | Points: 25

Up
0
Down
Hi, sometimes back I have written a step by step tutorial on "CRUD Operation using Web API and MVC4". It is available in dotnetfunda. You can find it here http://www.dotnetfunda.com/articles/show/2340/crud-operation-using-web-api-and-mvc4.

It has the sample code attached and the JQuery Ajax for performing the CRUD. That should help you.
Please go through it and you will get the concept to do the stuff.

GET (All the records ) / LOAD

$.ajax({


url: 'http://localhost:41207/api/employee',

type: 'GET',

dataType: 'json',

success: function (data) {

WriteResponses(data);

},

error: function (x, y, z) {

alert(x + '\n' + y + '\n' + z);

}

});



GET (for single records)

function GetSingleEmployee() {


jQuery.support.cors = true;

var empId = $('#txtSingleEmployeeId').val();



$.ajax({

url: 'http://localhost:41207/api/employee/' + empId,

type: 'GET',

dataType: 'json',

success: function (data) {

WriteResponseForSingleEmployee(data);

},

error: function (x, y, z) {

alert('The Employee not found in the List for the given ID');

}

});


And the WriteResponse.. function is here

function WriteResponseForSingleEmployee(employee) {       

var strResult = "<table><th>Id</th><th>Name</th><th>Gender</th><th>Age</th><th>Salary</th>";
strResult += "<tr><td>" + employee.id + "</td><td> " + employee.name + "</td><td>" + employee.gender + "</td><td>" + employee.age + "</td><td>" + employee.salary + "</td></tr>";
strResult += "</table>";
$("#divDisplaySingleEmployee").html(strResult);

}



ALL the BEST!!!
 Download source file

--
Thanks & Regards,
RNA Team

Klbaiju, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response