jquery.unobtrusive-ajax.min的观点引起奇怪的行为 [英] jquery.unobtrusive-ajax.min causing strange behavior on the view
问题描述
场景：
我有一个观点和看法里面我也的局部视图。
在主视图我有两个文本框和一个按钮。当用户输入数据并点击按钮，添加到数据库并显示数据在局部视图以表格格式。
局部视图也有一个删除链接的每一行。为了支持删除，我不得不使用jquery.unobtrusive-ajax.min。
问题：
当我点击按钮保存数据，就认为一切都疯了。整个页面变成两倍。请看到的图像。
但如果我删除jquery.unobtrusive-ajax.min的参考，问题不存在（删除不工作，然后虽然）。
任何人都知道这种行为，如何解决呢？
主要观点：
＆LT;％Html.EnableClientValidation（）; ％GT;
＆LT;使用％（Ajax.BeginForm（创建，计划，新AjaxOptions {UpdateTargetId =CreateData}））
{％GT;
＆LT; DIV ID =CreateData＆GT;
＆LT; DIV＆GT;
＆所述;％：Html.LabelFor（M =＆GT; m.Year）％GT;
＆LT; / DIV＆GT;
＆LT; DIV＆GT;
＆所述;％：Html.TextBoxFor（M =＆GT; m.Year）％GT;
＆LT; / DIV＆GT;
＆LT; DIV＆GT;
＆LT;表＆gt;
＆所述; TR＆GT;
＆所述; TD＆GT;＆下;％：Html.LabelFor（M =＆GT; m.Time）％GT;＆下; / TD＆GT;
＆所述; TD＆GT;＆下;％：Html.LabelFor（M =＆GT; m.Title）％GT;＆下; / TD＆GT;
＆LT; TD＆GT;＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆所述; TR＆GT;
＆所述; TD＆GT;＆下;％：Html.TextBoxFor（M =＆GT; m.Time）％GT;＆下; / TD＆GT;
＆所述; TD＆GT;＆下;％：Html.TextBoxFor（M =＆GT; m.Title）％GT;＆下; / TD＆GT;
＆LT; TD＆GT;＆LT;输入类型=形象值=注册SRC =../../内容/图片/ btnAdd.png/＆GT;＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆LT; /表＆gt;
＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
＆LT; DIV＆GT;
＆LT; DIV ID =结果＆GT; ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;＆LT; DIV CLASS =清除＆GT;＆LT; / DIV＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
$（函数（）{
。VAR年= $（＃年）VAL（）;
$（'＃结果'）负载（'/程序/浏览年= 2012？'）;
}）;
＆LT; / SCRIPT＆GT;
＆LT;％}％GT;
PartialView：
＆LT;表＆gt;
＆LT;％的foreach（在型号VAR项）
{％GT;
＆所述; TR＆GT;
＆LT; TD风格=宽度：150像素＆GT;＆LT;％：Html.En code（item.Time）％GT;＆LT; / TD＆GT;
＆LT; TD＆GT;＆LT;％：Html.En code（item.Title）％GT;＆LT; / TD＆GT;
＆LT;％ - ＆LT; TD＆GT;＆LT;％：Html.ActionLink（删除，删除，新{ID = item.ID}）％＆GT;＆LT; / TD＆GT; - ％＆GT;
＆LT; TD＆GT;＆LT;％：Ajax.ActionLink（删除，删除，新{ID = item.ID}，新AjaxOptions
{
确认=您确定要删除吗？
的onComplete =deleteCompleted
列举HTTPMethod =删除
}）％GT;＆下; / TD＆GT;
＆所述;％ - ＆下;一个的onclick =deleteRecord（小于％：item.ID％GT）的href =JavaScript的：无效（0）＆GT;删除＆下; / A＆GT;＆下; / TD＆GT; - ％ ＆GT;
＆LT; / TR＆GT; ＆LT;％}％GT;
＆LT; /表＆gt;
删除动作：
[授权（角色=管理员）]
的[AcceptVerbs（HttpVerbs.Delete）
公共ContentResult类型删除（INT ID）
{
变种查询=（从dc.Programme p
其中，p.ID == ID
选择P）。首先（）;
如果（查询！= NULL）
{
dc.Programme.DeleteObject（查询）;
dc.SaveChanges（）;
}
/ *返回RedirectToAction（创建）; * /
返回this.Content（）;
}
UpdateTargetId =CreateData??结果
你确定？结果
它将替换ProgramController.Create的结果是...包含完整表格视图的CreateData div的内容？结果
也许这是你的问题。
在包括jquery.unobtrusive-ajax.min，Ajax.BeginForm使用AJAX。结果
如果不包含它，它正在为Html.BeginForm没有Ajax。
Scenario: I have a View and inside that view I also a partial view. On the main view I have two textbox and a button. When user enters data and clicks on the button, data added to database and displays in a tabular format in the partial view.
The partial view also has a delete link for each row. To support that delete, I had to use "jquery.unobtrusive-ajax.min".
Problem: When I click the button to save data, everything on the view goes insane. The whole page becomes double. Please see the image. But If I remove the reference of "jquery.unobtrusive-ajax.min", the problem does not exists (delete doesnt work then though).
Anyone aware of this behavior, how to solve it??
The main view:
<%Html.EnableClientValidation(); %>
<% using (Ajax.BeginForm("Create","Program",new AjaxOptions{UpdateTargetId="CreateData"}))
{ %>
<div id="CreateData">
<div>
<%:Html.LabelFor(m=>m.Year) %>
</div>
<div>
<%:Html.TextBoxFor(m=>m.Year) %>
</div>
<div>
<table>
<tr>
<td><%:Html.LabelFor(m=>m.Time) %></td>
<td><%:Html.LabelFor(m=>m.Title) %></td>
<td></td>
</tr>
<tr>
<td><%:Html.TextBoxFor(m => m.Time)%></td>
<td><%:Html.TextBoxFor(m=>m.Title) %></td>
<td><input type="image" value="Register" src="../../Content/images/btnAdd.png"/></td>
</tr>
</table>
</div>
</div>
<div>
<div id="result">
</div>
</div>
<div class="clear"></div>
<script type="text/javascript">
$(function () {
var year = $("#Year").val();
$('#result').load('/Program/Browse?year=2012');
});
</script>
<%} %>
PartialView:
<table>
<% foreach (var item in Model)
{%>
<tr>
<td style="width:150px"><%:Html.Encode(item.Time) %></td>
<td><%:Html.Encode(item.Title) %></td>
<%--<td><%:Html.ActionLink("Delete","Delete",new {ID=item.ID}) %></td>--%>
<td><%:Ajax.ActionLink("Delete", "Delete", new { id = item.ID }, new AjaxOptions
{
Confirm = "Are you sure you want to delete?",
OnComplete = "deleteCompleted",
HttpMethod = "DELETE"
})%></td>
<%--<a onclick="deleteRecord(<%: item.ID %>)" href="JavaScript:void(0)">Delete</a></td>--%>
</tr>
<%} %>
</table>
Delete Action:
[Authorize(Roles = "Admin")]
[AcceptVerbs(HttpVerbs.Delete)]
public ContentResult Delete(int id)
{
var query = (from p in dc.Programme
where p.ID == id
select p).First();
if (query != null)
{
dc.Programme.DeleteObject(query);
dc.SaveChanges();
}
/* return RedirectToAction("Create");*/
return this.Content(" ");
}
UpdateTargetId="CreateData" ??
Are you sure ??
It will replace the content of the CreateData div with the result of ProgramController.Create which is ... the view containing the full form ?
Maybe this is your problem.
When you include jquery.unobtrusive-ajax.min, Ajax.BeginForm uses ajax.
If you do not include it, it is working as Html.BeginForm without ajax.
这篇关于jquery.unobtrusive-ajax.min的观点引起奇怪的行为的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
