级联下拉失去岗位后选择项目 [英] cascading dropdown loses select items after post

问题描述

我有一个MVC3剃刀项目，我想使用多个可重复使用的元素构建。我有很多的模型类像下面这样

I have an MVC3 razor project, which I am trying to build using multiple reusable elements. I have many model classes like the following

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; }
    }

有哪些，我忽略了这个例子

There are other fields which I am omitting for this example

MyAccountsDropDown.cshtml看起来是这样的：

MyAccountsDropDown.cshtml looks like this:

@{  
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 })

我的控制器方法是这样的：

My Controller methods look like this:

    [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，它从数据库（级联）​​的帐户名。现在，因为我使用的模型验证，当我没有在所有的必填字段，以及preSS提交，它让我看到验证信息。这也表明我提出我就已经进入前场的pre填充的值。什么是将删除已级联下拉值。因此，继续显示所选ORGNAME，但帐户名下拉从数据库中失去了previously填充的值。

So when the view opens (as a jQuery dialog box), I have the form all set. If I select an orgName, it pulls the accountName from the database (cascading). Now since I am using model validation, when I DO NOT fill in all the required fields, and press submit, it shows me the validation messages. It also shows me the pre-filled values of the fields I had already entered before submit. What is removes are the cascaded drop down values. So it continues to show the selected orgName, but the accountName drop down loses the previously filled values from the database.

我怎样才能保持与之前点击提交已经拉到一个SelectItems

How can I maintain the already pulled SelectItems from before the submit was clicked

推荐答案

在你的JavaScript部分更改code为：

Change the code in your javascript section to:

  $("#@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();
  });

这篇关于级联下拉失去岗位后选择项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！