Update ViewBag dropdownlist with ajax

Question

Я работаю над каскадным выпадающим списком с данными, переданными с помощью dataview.

Контроллер:

public ActionResult Index() 
{ 
    ViewBag.States = new SelectList(db.PLStates, "PLStateID", "PLStateName"); 
    ViewBag.Cities = new SelectList(db.PLCitys, "PLCityID", "PLCityName"); 

    return View(); 
} 

[HttpPost] 
public JsonResult GetCity(int SelectedStateId) 
{ 
    SelectList result = new SelectList(db.PLCitys.Where(x => x.PLStateID == 3), "PLCityID", "PLCityName"); 

    return Json(result); 
    //return Json(ViewBag.Cities = new SelectList(db.PLCitys.Where(x => x.PLStateID == 3), "PLCityID", "PLCityName")); 
} 

HTML:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#States").change(function() { 
      var SelCity1 = $("#States").val(); 
      $("#Cities").empty(); 
      $.ajax({ 
       type: 'POST', 
       url: '@Url.Action("GetCity")', 
       dataType: 'JSON', 
       data: { SelectedStateId: SelCity1 }, 
       success: function (Cities) { 
        ViewBag.Cities = Cities; 

        $("#Cities").append('Cities'); 
        alert("success" + Cities); 
      }, 
       error: function (ex) { 
        alert('Failed to retrieve states.' + ex); 
       } 
      }); 
      return false; 
     }) 
    }); 

</script> 

<div> 
    @Html.DropDownList("States", "Select one") 
    @Html.DropDownList("Cities", "Select one") 
</div> 

В боевой готовности я могу видеть JSON возвращает объекты, но Города DropDownList становится опустели без значения внутри. Почему ddl.cities не заполняется сохраненными значениями?

Дополнительный вопрос: как добавить стиль в раскрывающийся список?

Answer 1

Вам нужно будет вручную добавить параметры в города, выпадающие через js с данными Json, возвращаемыми с контроллера.

Что касается укладки. Вы можете использовать стиль inline, добавив «style» = в атрибуты html или стиль с помощью внешнего класса css, используя атрибут @class html.