【问题标题】:How To Populate Html.Listbox with Ajax result using mvc 4如何使用 mvc 4 使用 Ajax 结果填充 Html.Listbox
【发布时间】:2013-12-15 09:17:48
【问题描述】:

在我的 MVC 4 应用程序中,我想用 Ajax 结果填充 Html.LisboxFor。

我的观点: @using (Html.BeginForm("UpdatePriority", "Priority", FormMethod.Post)) {

    @Html.Hidden("myListBoxValuesValues")

    <div class="row">

        <div class="col-md-2">
            <label>FA:</label>
            @Html.ListBoxFor(m => m.FA, new MultiSelectList(@Model.FA), new { @class = "lbx_FA" })
        </div>

        <div class="col-md-1">
            <input id="btnAdd" type="button" value="  > " onclick="addItem();" />
        </div>

        <div class="col-md-2">
            <label>CEID list:</label>
            @Html.ListBoxFor(model => model.CEIDs, new MultiSelectList(Model.CEIDs), new { @class = "lbx_CEIDs" })
        </div>

...and so on..

我的控制器函数(返回 json 模型的字符串):

public string getCeidPerFA(string FA)
        {
            return unitOfWork.ToolRequiredRepository.getCEIDsPerFA_Scenario(DAL.UnitOfWork.Scenario, FA);
        }

存储库功能:

internal string getCEIDsPerFA_Scenario(string scenario, string FA)
        {
            //create the result list (FAs):

            List<string> FAs = FA.Split(',').ToList();

            var CEIDs = from row in context.ToolRequireds
                      where row.Scenario == scenario && FAs.Contains(row.FA)
                      select row.CEID;

            List<string> lst = CEIDs.Distinct().ToList();

            //create Json Result:

            List<SelectListItem> items = new List<SelectListItem>();

            foreach (var ceid in lst)
            {
                items.Add(new SelectListItem { Text = ceid, Value = ceid });
            }


            return Json.Encode(items);
        }

我的脚本:

   function addItem() {

    var result = "";

    var x = document.getElementById("FA");
    for (var i = 0; i < x.options.length; i++) {
        if (x.options[i].selected == true) {
            result += x.options[i].value + ",";
        }
    }

    result = result.substring(0, result.length - 1);

    $.ajax({

        url: "@(Url.Action("getCeidPerFA", "CeidSelection"))",

        data: { "FA": result },

        success: function (data) {


            if (data.length > 0) {
                JSON.pa
                $("#CEIDs").append(JSON.parse(data));
            }
            else
                alert("No Result");
        },

        error: function (xhr) {

            alert("Something went wrong, please try again");

        }

    });
}

我的代码是错误的,但我不知道该怎么做。 任何帮助将不胜感激。

【问题讨论】:

    标签: ajax asp.net-mvc-4 jquery


    【解决方案1】:

    像这样循环遍历数据结果

    $('#CEIDs').empty();
    $.each($(data), function(key, value) {
        $('#CEIDs').append('<option value=' + key + '>' + value + '</option>');
    });
    

    【讨论】:

    • 我更改了函数以返回 JsonResult。我正在创建这样的 JsonResult: JsonResult js = new JsonResult() { Data = items, JsonRequestBehavior = JsonRequestBehavior.AllowGet };然后我在ajax成功中使用你的代码。现在我在列表框中看到的只是:“[object Object]”。我看不到 Json 的实际值。
    • 这告诉我你有列表项但没有值。如果您使用 firebug 查看对象,您应该能够确定需要查看的名称。应该类似于 value.key 和 value.value,无论您在这些字段上使用什么名称
    • 谢谢!有用。我使用了您的提示并使用 chrome 开发人员工具设法调试了 Json 并进行了适当的调整。
    猜你喜欢
    • 1970-01-01
    • 2014-08-15
    • 2023-03-15
    • 1970-01-01
    • 2016-10-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-02-22
    相关资源
    最近更新 更多