ahmed salah

ahmed salah

  • 1.6k
  • 530
  • 125.7k

select item from city not fill items in district drop down

Aug 17 2016 12:28 PM

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

EmployeeController
  1. public class EmployeeController : Controller  
  2. {  
  3.   
  4. // GET: Employee  
  5. mytaskdbEntities db = new mytaskdbEntities();  
  6. public ActionResult Index()  
  7. {  
  8. return View(db.Employees.ToList());  
  9. }  
  10. public ActionResult Create()  
  11. {  
  12. ViewBag.CountryList = new SelectList(db.Countries.ToList(), "Id","Countryname");  
  13.   
  14. return View();  
  15. }  
  16. public JsonResult getcitybyid(int id)  
  17. {  
  18. db.Configuration.ProxyCreationEnabled = false;  
  19. return Json(db.Cities.Where(a =>a.CountryId == id), JsonRequestBehavior.AllowGet);  
  20. }  
  21. public JsonResult getdistrictbyid(int id)  
  22. {  
  23. db.Configuration.ProxyCreationEnabled = false;  
  24. return Json(db.Districts.Where(a => a.CityId == id), JsonRequestBehavior.AllowGet);  
  25. }  
  26. }  
  27. }  

 my Employee view as following :
 
  1. @model LinqProject.Models.Employee  
  2. @{  
  3. Layout = null;  
  4. }  
  5.   
  6. <!DOCTYPE html>  
  7.   
  8. <html>  
  9. <head>  
  10. <meta name="viewport" content="width=device-width" />  
  11. <title>Create</title>  
  12. <script src="~/Scripts/jquery-1.10.2.js"></script>  
  13. <script>  
  14. $(function () {  
  15. $("#CountryList").change(function () {  
  16. $("#citylist").empty();  
  17. // alert("error");  
  18. var x = $(this).val();  
  19. $.ajax({  
  20. url: "/Employee/getcitybyid",  
  21. data: { id: x },  
  22. success:function(res)  
  23. {  
  24. $.each(res, function (i, e) {  
  25. $("#citylist").append("<option value='"+e.id+"'>"+e.Cityname+"<option>")  
  26.   
  27. });  
  28. }  
  29. });  
  30.   
  31.   
  32. });  
  33. $("#citylist").change(function () {  
  34. $("#districtlist").empty();  
  35. var y = $(this).val();  
  36. $.ajax({  
  37. url: "/Employee/getdistrictbyid",  
  38. data: { id: y },  
  39. success: function (res) {  
  40. $.each(res, function (i, e) {  
  41. $("#districtlist").append("<option value='" + e.id + "'>" + e.Districtname + "<option>")  
  42.   
  43. });  
  44. }  
  45. });  
  46.   
  47.   
  48. });  
  49. });  
  50. </script>  
  51. </head>  
  52. <body>  
  53. <div>   
  54. @using (Html.BeginForm())  
  55. {  
  56. <div>  
  57. FirstName:@Html.TextBoxFor(a=>a.fname)  
  58.   
  59. </div>  
  60. <div>  
  61. LastName:@Html.TextBoxFor(a => a.sname)  
  62.   
  63. </div>  
  64. <div>  
  65. Salary:@Html.TextBoxFor(a => a.Salary)  
  66.   
  67. </div>  
  68. <div>  
  69. Bonus:@Html.TextBoxFor(a => a.Bonus)  
  70.   
  71. </div>  
  72. <div>  
  73. Bonus:@Html.TextBoxFor(a => a.Active)  
  74.   
  75. </div>  
  76. <div>  
  77. CountryName:@Html.DropDownList("CountryList")  
  78.   
  79. </div>  
  80. <div>  
  81. CityName:<select id="citylist" name="CityId"></select>  
  82. </div>  
  83. <div>  
  84. District:<select id="districtlist" name="districtId"></select>  
  85. </div>  
  86. <input type="submit" />  
  87. }  
  88. </div>  
  89. </body>  
  90. </html>  

Answers (3)