I have 4 table relation in sql server database is good
Country table
Id primarykey increment identity
Countryname
City table
Id primary key increment identity
Cityname
CountryId forignkey
Ditrict table
Id primarykey increment identity
Districtname
CityId forignkey
Employee table
Id primary key increment identity
fname
sname
salary
Bonus
districtid forignkey
Relation not have any proplem
when select items from country it fill city drop down list without any problem
but when i select item from city it not fill items in district why
something wrong in my code i do as following
my controller employee as following
Employee Controller
public class EmployeeController : Controller
{
// GET: Employee
mytaskdbEntities db = new mytaskdbEntities();
public ActionResult Index()
{
return View(db.Employees.ToList());
}
public ActionResult Create()
{
ViewBag.CountryList = new SelectList(db.Countries.ToList(), "Id","Countryname");
return View();
}
public JsonResult getcitybyid(int id)
{
db.Configuration.ProxyCreationEnabled = false;
return Json(db.Cities.Where(a =>a.CountryId == id), JsonRequestBehavior.AllowGet);
}
public JsonResult getdistrictbyid(int id)
{
db.Configuration.ProxyCreationEnabled = false;
return Json(db.Districts.Where(a => a.CityId == id), JsonRequestBehavior.AllowGet);
}
}
}
my Employee view is
@model LinqProject.Models.Employee
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Create</title>
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script>
$(function () {
$("#CountryList").change(function () {
$("#citylist").empty();
// alert("error");
var x = $(this).val();
$.ajax({
url: "/Employee/getcitybyid",
data: { id: x },
success:function(res)
{
$.each(res, function (i, e) {
$("#citylist").append("<option value='"+e.id+"'>"+e.Cityname+"<option>")
});
}
});
});
$("#citylist").change(function () {
$("#districtlist").empty();
var y = $(this).val();
$.ajax({
url: "/Employee/getdistrictbyid",
data: { id: y },
success: function (res) {
$.each(res, function (i, e) {
$("#districtlist").append("<option value='" + e.id + "'>" + e.Districtname + "<option>")
});
}
});
});
});
</script>
</head>
<body>
<div>
@using (Html.BeginForm())
{
<div>
FirstName
Html.TextBoxFor(a=>a.fname)</div>
<div>
LastName
Html.TextBoxFor(a => a.sname)</div>
<div>
Salary
Html.TextBoxFor(a => a.Salary)</div>
<div>
Bonus
Html.TextBoxFor(a => a.Bonus)</div>
<div>
Bonus
Html.TextBoxFor(a => a.Active)</div>
<div>
CountryName
Html.DropDownList("CountryList")</div>
<div>
CityName:<select id="citylist" name="CityId"></select>
</div>
<div>
District:<select id="districtlist" name="districtId"></select>
</div>
<input type="submit" />
}
</div>
</body>
</html>
