I have 2 dropdown list boxes where I load values into the first dropdown list and based on its selection, I load values into the second dropdown list using the same action method through ajax.
Here is the script I am using:
$(document).ready(function () {
$("#ddlOrgs").change(function () {
var listSite = $("#_site");
var SelctedOrgCode = $("#ddlOrgs").val();
alert(SelctedOrgCode);
if (SelctedOrgCode != 0) {
var url = '@Url.Action("GetSites","FilterMenu")';
$.ajax({
url : url,
type: 'POST',
tempdata:{},
data: JSON.stringify(tempdata),
dataType: 'json',
contentType: "application/json; charset=utf-8",
})
.done(function (data) {
var sitesDropdown = $("#ddlSites");
var list = data;
$.each(list, function (index, item) {
sitesDropdown.append('<option value?+item.SiteCode+?="">' + item.SiteName + '</option>');
alert(item);
});
})
.fail(function(xhr){
alert('failed');
alert(xhr.responseText);
});
}
});
});
The Controller action methods are as follows:
[HttpPost]
public IEnumerable<Client> LoadFiltersX(constants.ClientType clientType)
{
// Code here
}
[HttpPost]
public JsonResult GetSites()
{
return Json( LoadFiltersX(constants.ClientType.SITE), JsonRequestBehavior.AllowGet);
}
In my repository, I return a List collection like this:
public List<Client> GetClientInformation(constants.ClientType clientType)
{
// Code here
}
The view part in the Layout file looks like this:
@if (Session.Count > 0 && Session["UserName"].ToString().Length > 0)
{
// Code here
}
When calling, no results are returned and the console displays an error "tempdata undefined". The method does not pass any parameters. Each dropdown list has the same client list but the first takes 'ORG' enum and the second takes 'SITE' enum. So I passed it for each method. I want to get the list to populate the dropdown list. I can successfully load the first dropdown list via a normal Action method in the Controller, but the problem occurs in the ajax method. Can anyone help me with this issue? Thank you in advance.
Thank you, tpk