2014-01-15 38 views
1

我正在開發一個MVC 4 Web應用程序。其中剃刀意見有兩個下拉列表。第一個下拉列表由傳遞給視圖的ViewModel數據填充。使用JQueryAjax基於從第一個下拉列表(級聯)中選擇的ID調用次級下拉列表。編輯時未選擇MVC級聯下拉菜單

我有這個工作正常,但是,無論何時用戶希望編輯一個現有的記錄,我無法得到所選的二級下拉列表值被選中。

這是兩個下拉列表

<div class="lbl_a"> 
    Employer: 
</div> 
<div class="editor-field sepH_b"> 
    @Html.DropDownListFor(model => model.Employer, Model.EmployerList, "Select", new { @class = "inpt_a" }) 
</div> 

<div class="editor-label"> 
    @Html.LabelFor(model => model.DirectorateID, "Directorate/ Service Group") 
</div> 
<div class="editor-field"> 
    @Html.DropDownListFor(model => model.DirectorateID, Model.DirectorateList, "Select") 
</div> 

這是我的jQuery代碼我的剃刀代碼

$(document).ready(function() { 

//Pre load on page load 
onEmployerChange(); 

//Hide and show DIVS based on selection 
$("#Employer").change(onEmployerChange); 

function onEmployerChange() { 

     var dataPost = { orgID: val }; 
     $.ajax({ 
      type: "POST", 
      url: '/User/GetDirectorates/', 
      data: dataPost, 
      dataType: "json", 
      error: function() { 
       alert("An error occurred." + val); 
      }, 
      success: function (data) { 
       var items = ""; 
       $.each(data, function (i, item) { 
        items += "<option value=\"" + item.Value + "\">" + item.Text + "</option>"; 
       }); 

       $("#DirectorateID").html(items); 
      } 
     }); 

    } 
} 

});

當用戶選擇從所述第一下拉列表中的值,所選擇的ID被傳遞給GetDirectorates的用戶控制器動作。

這是我GetDirectorates動作返回JSON數據

public ActionResult GetDirectorates(string orgID) 
{ 
    if (String.IsNullOrWhiteSpace(orgID)) 
     orgID = "0"; 

    var Directorates = _ListService.GetListItemsByOrganisationID(Convert.ToInt32(orgID)); 

     List<SelectListItem> directorateList = new List<SelectListItem>(); 
     directorateList.Add(new SelectListItem() { Text = "Select", Value = "" }); 

     foreach (var directorate in Directorates) 
     { 
      directorateList.Add(new SelectListItem() { Text = directorate.description, Value = directorate.listItemID.ToString(), Selected = false }); 
     } 

     return Json(new SelectList(directorateList, "Value", "Text")); 
    } 

每當用戶希望編輯現有記錄我通過雙方的第一個值和第二個下拉列表。這兩個下拉列表都按照預期填充了正確的數據,但是,第二個下拉列表的選定值從未被選中。

這是用戶在嘗試編輯現有記錄時調用的編輯動作的縮短版本,但顯示傳遞的兩個下拉列表選定值。

public ActionResult EditNonMember(int id, string feedback, string courseDateID, string courseID) 
{ 
    //code to retrieve data here 

    vm.Employer = UserDetails.Employer; 
    vm.DirectorateID = UserDetails.DirectorateID; 

    return View(vm); 
} 

任何人都可以幫助我嗎?

謝謝。

回答

2

您需要獲取保存的僱主ID的首長級名單,並設置DirectorateList集合,然後設置DirectorateID(來自保存的記錄);

public ActionResult EditNonMember(int id, string feedback, string courseDateID, 
                   string courseID) 
{ 
    //code to retrieve data here 
    var userDetails=repositary.GetUserFromSomeId(id); 
    vm.Employers=GetEmployers(); 
    vm.Employer = userDetails.Employer; 
    vm.DirectorateList=GetDirectorateListForEmployer(userDetails.Employer); 
    vm.DirectorateID = userDetails.DirectorateID; 

    return View(vm); 
} 
private List<SelectListItem> GetEmployers() 
{ 
    // to do : Return all employers here in List<SelectListItem> 
} 
private List<SelectListItem> GetDirectorateListForEmployer(int employerId) 
{ 
    // to do : Return all Directorates for the selected employer 
} 
1

這應該做的伎倆:

var subSelect = $("#DirectorateID"); 
// clear the selection    
subSelect.empty(); 

//append each option to the list 
$.each(data, function (i, item) { 
    subSelect.append($('<option/>', { 
         value: item.Value, 
         text: item.Text 
        })); 
}); 

而不是通過html方法設置它,我只是一個附加選項。

這是我用於使用ajax級聯下拉列表的方法。