what is wrong in this code?
when i change drop down list,the grid takes old value of ddl only, not taken newely selected values why?
<%--
$(function() {
$("#StateId").change(function() {
$('#TheForm').submit();
});
});
$(function() {
$("#CityId").change(function() {
$('#TheForm').submit();
});
});
$(function() {
$("#HospitalName").change(function() {
$('#TheForm').submit();
});
});
--%
var gridimgpath = '/scripts/themes/coffee/images';
var gridDataUrl = '/Claim/DynamicGridData/';
jQuery(document).ready(function() {
// $("#btnSearch").click(function() {
var StateId = document.getElementById('StateId').value;
var CityId = document.getElementById('CityId').value;
var HName = document.getElementById('HospitalName').value;
// alert(CityId);
// alert(StateId);
// alert(HName);
if (StateId 0 && CityId == '' && HName == '') {
CityId = 0;
HName = 'Default'.toString();
// alert("elseif0" + HName.toString());
}
else if (CityId 0 && StateId == '') {
// alert("elseif1");
alert("Please Select State..")
}
else if (CityId 0 && StateId 0 && HName == '') {
// alert("elseif2");
alert(CityId);
alert(StateId);
HName = "Default";
}
else {
// alert("else");
StateId = 0;
CityId = 0;
HName = "Default";
}
jQuery("#list").jqGrid({
url: gridDataUrl + '?StateId=' + StateId + '&CityId=' + CityId + '&hospname=' + HName,
datatype: 'json',
mtype: 'GET',
colNames: ['Id', 'HospitalName', 'Address', 'City', 'District', 'FaxNumber', 'PhoneNumber'],
colModel: [{ name: 'HospitalId', index: 'HospitalId', width: 40, align: 'left' },
{ name: 'HospitalName', index: 'HospitalName', width: 40, align: 'left' },
{ name: 'Address1', Address: 'Address1', width: 300 },
{ name: 'CityName', index: 'CityName', width: 100 },
{ name: 'DistName', index: 'DistName', width: 100 },
{ name: 'FaxNo', index: 'FaxNo', width: 100 },
{ name: 'ContactNo1', index: 'PhoneNumber', width: 100 }
],
pager: jQuery('#pager'),
rowNum: 10,
rowList: [5, 10, 20, 50],
// sortname: 'Id,',
sortname: '1',
sortorder: "asc",
viewrecords: true,
//multiselect: true,
//multikey: "ctrlKey",
// imgpath: '/scripts/themes/coffee/images',
imgpath: gridimgpath,
caption: 'Hospital Search',
width: 700,
height: 250
});
$(function() {
// $("#btnSearch").click(function() {
$('#CityId').change(function() {
alert("kjasd");
// Set the vars whenever the date range changes and then filter the results
StateId = document.getElementById('StateId').value;
CityId = document.getElementById('CityId').value;
HName = 'default';
setGridUrl();
});
// Set the date range textbox values
$('#StateId').val(StateId.toString());
$('#CityId').val(CityId.toString());
// Set the grid json url to get the data to display
setGridUrl();
});
function setGridUrl() {
alert(StateId);
alert(CityId);
alert("hi");
var newGridDataUrl = gridDataUrl + '?StateId=' + StateId + '&CityId=' + CityId + '&hospname=' + HName;
jQuery('#list').jqGrid('setGridParam', { url: newGridDataUrl }).trigger("reloadGrid");
}
// });
});
<%--<%using (Html.BeginForm("HospitalSearch", "Claim", FormMethod.Post, new { id = "TheForm" }))
--%
Hospital Search
State :
City :
Hospital Name :
<div id="jqGridContainer">
<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
</div>