4

如何更新 MVC3 中的下拉列表。我想用其他视图填充的最新数据重新填充它,但我不想回发视图并想用 jquery 实现它。我有一个下拉列表,例如:

@Html.DropDownListFor(m => m.Department, Model.Departments)
@Html.ValidationMessageFor(m => m.Departments)
<input type="button" value="Refresh" id="btnrefresh" />

我已经编写了 jquery 代码来调用控制器的方法:

 $("#btnrefresh").click(function () {
 var ref = '@Url.Action("RefreshDepartments")';
 var model = '@Model.ToJson()';
 var data = { empModel: model };
 $.getJSON(ref, data, function (result) { alert(result.message); });
        return false;
    });

这是控制器方法:

public ActionResult RefreshDepartments(EmployeeModel empModel)
    {
        empModel.Departments = GetDepartments();
        empModel.Roles = GetRoles();
        return Json(new { message = "Updated successfully"}, JsonRequestBehavior.AllowGet);
    }

在没有任何回发的情况下,如何在单击“刷新”按钮时使用最新值更新下拉列表?将模型传递给控制器​​并更新模型属性是个好主意吗?还有哪些可能的方法?

4

2 回答 2

0

在我看来,您不需要将模型发布到您的控制器以执行您正在执行的操作。另外,是的,你绝对可以用 jquery 做到这一点!附带说明一下,您也可以使用 Ajax.BeginForm() 辅助方法来执行此操作,但让我们处理您的 jquery 示例。

您可以简单地调用路径本身,而不是使用 @Url.Action 使您的 jquery 复杂化。

$("#btnrefresh").click(function () {
    var ref = 'ControllerName/RefreshDepartments';
    $.each(result, function (index, val) {
        $('#whateverYourRenderedDropdownListHtmlObjectis')
            .append($("<option></option>")
            .attr("value", val.Text)
            .text(val.Text));
    });
});

现在,对于您的控制器...

public JsonResult RefreshDepartments()
{
    return Json(GetDepartments, JsonRequestBehavior.AllowGet);
}

private SelectList GetDepartments
{
    var deparments = GetDepartments;
    SelectList list = new SelectList(departments);
    return list;
}

这是返回模型的替代方法。它允许您改为操作原始 JSON。希望能帮助到你!

于 2013-01-25T05:26:10.160 回答
0

你几乎都做到了!为什么不通过 RefreshDepartments 操作发送数据,我的意思是列表?您发送了一条要查看的消息,因此您可以类似地发送列表,而不是提醒结果,您可以填写下拉列表。像这样的东西:

public ActionResult RefreshDepartments(EmployeeModel empModel)
    {
        return Json(new { departments = GetDepartments()}, JsonRequestBehavior.AllowGet);
    }


$.getJSON(ref, data, function (result) { 
    $("#Department").html("");
    for (var i = 0; i < result.departments.length; i++) {
        var item = result.departments[i];
        $("#Department").append(
              $("<option></option>").val(item.Id).html(item.Name);
        );
    });
});
于 2013-01-25T05:33:56.890 回答