【发布时间】: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