【问题标题】:Jquery Chosen plug in adds section on postbackJquery Chosen 插件增加了回发部分
【发布时间】:2015-11-04 17:51:21
【问题描述】:

我正在为 MVC 应用程序使用 Jquery Chosen 插件,并且所有内容最初都正确加载。但是,如果我使用 ajax 调用使用来自服务器的数据刷新页面上的 div,它会创建一个完整的重复部分。

如何防止这种情况发生?

<div id="div1">
     <div id="div2">

     </div>
     <div class="col-xs-4">
         @Html.DropDownListFor(m => m.Id, Model.List.GetSelectionList(Model.Id, "Please select a Name to add."), new { @id = "id", @class = "chosen-select" })
     </div>
     <div class="col-xs-1">
         <input type="button" id="btnAdd" value="Add Name" onclick="AddName();" />
     </div>
 </div>

<script type="text/javascript">
function AddName() {
    var id= $('#id').val();
    if (id> 0) {
        var url = '@Url.Action("AddName")';
        $.ajax(
            {
                type: "GET",
                url: '@Url.Action("AddName")',
                data: { id: id},
                success: function (data) {
                    $('#div2').html(data); //This is what duplicates the whole section
                },
                error: function (x, status, error) {
                    debugger;
                    alert(status + " " + error);
                }
            });
    }
};

var config = {
    '.chosen-select': {},
    '.chosen-select-deselect': { allow_single_deselect: true },
    '.chosen-select-no-single': { disable_search_threshold: 10 },
    '.chosen-select-no-results': { no_results_text: 'Oops, nothing found!' },
    '.chosen-select-width': { width: "95%" }
}
for (var selector in config) {
    $(selector).chosen(config[selector]);
}

这是初始加载:

这是在我点击添加名称之后:

【问题讨论】:

  • 我忘了添加重复部分仅在我第一次刷新 div 时发生。此后的任何时候,它都不会创建重复的部分。
  • “数据”的内容是什么?概念证明here
  • 数据的内容是整个部分页面,而不仅仅是我试图更新的部分。这导致了错误

标签: jquery asp.net ajax jquery-chosen


【解决方案1】:

这个问题实际上与选择无关。我在 ajax 调用返回时更新了错误的 div。我需要更新整个局部视图的 div 而不仅仅是其中的一部分。一旦我改变它,它就纠正了问题。

【讨论】:

    猜你喜欢
    • 2012-07-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-04-14
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多