Question

我必须在下拉列表值更改后刷新两个ListBox的项目。 ListBoxes的数据在ViewData中，我从jquery函数调用一个动作控制器，但调用后的ViewData具有相同的数据。

以下是代码：

$(document).ready( function () {
        $('#users').change(function () {
            var selectedValue = $('#users').val();
            $.post('@Url.Action("GruposUsuario", "Grupos")', { usersId: selectedValue }, function () {
                var gruposAsig = JSON.parse('@Html.Raw(Json.Encode(ViewData["gruposAsignados"]))');
                var gruposDisp = JSON.parse('@Html.Raw(Json.Encode(ViewData["gruposDisponibles"]))');
                $('#gruposAsignados').empty();
                $('#gruposAsignados').addItems(gruposAsig);
                $('#gruposDisponibles').empty();
                $('#gruposDisponibles').addItems(gruposDisp);
            });
        });
        $.fn.addItems = function (grupos) {
            return this.each(function () {
                var list = this;

                $.each(grupos, function (index, itemData) {
                    var option = new Option(itemData.Text, itemData.Value);
                    list.add(option);
                });
            });
        };


    });

控制器代码：

[HttpPost]
        public ActionResult GruposUsuario(string usersId)
        {
            AllUsers();
            GruposAsignados(int.Parse(usersId));
            //GruposDispobibles(int.Parse(usersId));
            return Json("Usuario");
        }


        void GruposAsignados(int usersId)
        {            
            var grupos  = new BL.Grupos().GruposAsignados(usersId);
            List<SelectListItem> list = new List<SelectListItem>();
            foreach (var grupo in grupos)
            {
                SelectListItem selectList = new SelectListItem()
                {
                    Text = grupo.GroupName,
                    Value = grupo.GroupsId.ToString()
                };
                list.Add(selectList);
            }
            ViewData["gruposAsignados"] = list as IEnumerable<SelectListItem>;
        }

如何在活动结束后重新制作ViewDatas？

Answer 1

Razor代码在发送到视图之前在服务器上进行解析。您对@Html.Raw(...)的使用会将gruposAsig和gruposDisp的值分配给ViewData属性的初始值（在您首次呈现页面时检查源）。

在任何情况下，方法GruposAsignados()仅返回值为"Usuario"的字符串。如果要返回json数据以更新两个下拉列表中的选项，则控制器方法应为

[HttpGet] // its a GET
public ActionResult GruposUsuario(string usersId)
{
  var gruposAsignados= new BL.Grupos().GruposAsignados(usersId).Select(g => new
  {
    ID = g.grupo.GroupsId;
    Name = g.GroupName;
  }
  var gruposDisponibles = // another query
  return Json(new { Asignados = gruposAsignados, Disponibles = gruposDisponibles, JsonRequestBehavior.AllowGet);
}

然后脚本应该是

var asignados = $('#gruposAsignados'); // cache it
var disponibles = $('#gruposDisponibles');
$.getJSON('@Url.Action("GruposUsuario", "Grupos")', { usersId: selectedValue }, function (response) {
  if(response) {
    asignados.empty();
    // or asignados.empty().append($('</option>').val('').text('-Please select-'));
    $.each(response.Asignados, function(index, item) {
      asignados.append($('</option>').val(item.ID).text(item.Name));
    });
    disponibles.empty();
    $.each(response.Disponibles, function(index, item) {
      disponibles.append($('</option>').val(item.ID).text(item.Name));
    });
  }
});

附注：无需创建IEnumerable<SelectListItem>。浏览器不知道C＃类是什么，只返回从未使用过的额外不必要的数据（Selected，Group和Disabled属性的值）。

调用Jquery函数MVC后{Refesh ViewData

1 个答案: