級聯下拉後失去選擇項

Question

我有一個MVC3剃刀項目，我試圖建立使用多個可重用的元素。我有很多模型類，如下面的

public class ProductCreateModel 
    { 
     [Required] 
     [Display(Name = "Org")] 
     [UIHint("MyOrgsDropDown")] 
     public string orgName { get; set; } 

     [Required(ErrorMessage = "Select an account")] 
     [Display(Name = "Account")] 
     [UIHint("MyAccountsDropDown")] 
     [AdditionalMetadata("orgFieldId", "orgName")] 
     [AdditionalMetadata("fieldId", "accountName")] 
     public string accountName { get; set; } 
    } 

有哪些，我忽略了這個例子等領域

MyAccountsDropDown.cshtml看起來是這樣的：

@{ 
var values = ViewData.ModelMetadata.AdditionalValues; 
string orgFieldId = (string)values["orgFieldId"]; 
string fieldId = (string)values["fieldId"]; 
} 
<script type="text/javascript"> 
$(document).ready(function() { 
    $("#@orgFieldId").change(function() { 
     var idProd = $(this).val(); 
     $.getJSON("/JsonService/GetAccounts", { orgId: idProd }, 
      function (myData) { 
       var select = $("#@fieldId"); 
       select.empty(); 
       $.each(myData, function (index, itemData) { 
        select.append($('<option/>', { 
         value: itemData.Value, 
         text: itemData.Text 
        })); 
       }); 
      }); 
    }); 
}); 
</script> 


@Html.DropDownList("", new SelectList(Enumerable.Empty<SelectListItem>(), "Value", "Text"), "---Select---", new { id = fieldId }) 

我的控制器方法是這樣的：

[HttpGet] 
    public ActionResult AddProduct() 
    { 
     return PartialView("_AddProduct"); 
    } 

    [HttpPost] 
    public ActionResult AddProduct(ProductCreateModel model) 
    { 
     if (!ModelState.IsValid) 
     { 
      return PartialView("_AddProduct", model); 
     } 

     //do some stuff 

     return PartialView("_AddProduct"); 
    } 

所以當視圖打開時（作爲一個jQuery對話框），我有表格全部設置。如果我選擇一個orgName，它將從數據庫中提取accountName（級聯）。現在，因爲我正在使用模型驗證，所以當我不填寫所有必填字段並按下提交時，它會顯示驗證消息。它還顯示我在提交之前已經輸入的字段的預填充值。什麼是刪除是級聯下拉值。因此它會繼續顯示選定的orgName，但accountName下拉列表將丟失數據庫中以前填充的值。

如何提交被點擊

Answer 1

變化之前，我可以保持已經拉到一個SelectItems從代碼在JavaScript部分：

$("#@orgFieldId").change(function() { 
     var idProd = $(this).val(); 
     $.getJSON("/JsonService/GetAccounts", { orgId: idProd }, 
      function (myData) { 
       var select = $("#@fieldId"); 
       select.empty(); 
       $.each(myData, function (index, itemData) { 
        select.append($('<option/>', { 
         value: itemData.Value, 
         text: itemData.Text 
        })); 
       }); 
      }); 
    }); 

    $(document).ready(function() { 
    $("#@orgFieldId").change(); 
    });