部分视图刷新后保存数据的对话框
本文关键字:数据 对话框 保存 视图 刷新 | 更新日期: 2023-09-27 18:10:41
我有一个局部视图,它打开一个对话框来输入一些数据。单击按钮后,将执行一个Ajax调用来重置该部分视图和另一部分视图。当我逐步通过代码,一切似乎工作正常,除了当我打开部分视图备份它的数据仍然在框中。我发现一些成功以下这个问题缓存问题加载部分视图到JQuery对话框,但当我实现的按钮不工作的第二次我使用它。我的代码如下:
jQuery和Ajax,用于刷新视图和包含其他部分视图的视图:
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$('#ChangeHeatName').click(function (e) {
var tdata = $('#form1').serialize();
var origname = $('#HeatNameDiv').find('input[name="heatName"]').first().val();
var newname = $('#HeatNameDiv').find('input[name="updatedHeat"]').first().val();
$.ajax({
type: "POST",
data: {
mCollection: tdata,
heatName: origname,
updatedHeat: newname
},
url: '@Url.Action("ChangeHeatName","Home")',
//url: "/Home/ChangeHeatName",
success: function (result) { success(result); }
});
});
function success(result) {
$('#HeatNameDiv').dialog('close');
//Ajax with problem
$.ajax({
type: "GET",
url: '@Url.Action("ButtonsPartial","Home")',
success: function (result2) { $("#ButtonsPartial").html(result2); }
});
$("#Partial_Chem_Analysis").html(result);
}
});
</script>
<section>
<div id ="ButtonsPartial" title="ButtonsPartial">
@Html.Action("ButtonsPartial", "Home")
</div>
<div id="Partial_Chem_Analysis" title="Partial_Chem_Analysis">
@Html.Action("PartialChemAnalysis", "Home", Model)
</div>
</section>
<section>
局部视图:
@using System.Data;
@using System.Dynamic;
@using System.Collections.Generic;
@using System.Linq;
@model TheManhattanProject.Models.ButtonsModel
<div id="Chem_Buttons">
<h2 class="alignleft">Chemistry Table</h2>
<p class="alignright">Heat Name<input type="text" name="heat_name" value="@Model.heatName" class="search-query" placeholder="Search" style ="width:100px" readonly="true"/>
<button class="btn btn-success" id="Change_Heat_Name" value="Change_Heat_Name" name="action:Change_Heat_Name" type="button"> Change Heat Name</button>
Grade<input type="text" name="heat_grade" value="@Model.grade" class="search-query" placeholder="Search" style="width:100px" readonly="true"/>
<button class="btn btn-success" id="ChangeHeatGrade" value="ChangeHeatGrade" name="action:Change_Grade" type="button">Change Grade</button>
Delete Record<input type="text" name="delete_record" value="@Model.heatName" class="search-query" placeholder="Search" style ="width:100px" readonly="true"/>
<button class="btn btn-success" id="DeleteRecord" value="DeleteRecord" name="action:Delete_Record" type="button">Delete Record</button>
</p>
<div style="clear: both;"></div>
</div>
<div id="HeatNameDiv" title="Change Heat Name">
@using (Html.BeginForm("ChangeHeatName", "Home", "POST"))
{
<section>
Heat Name:<input type="text" name="heatName" value="@Model.heatName" style ="width:100px" readonly="true"/>
//Value staying to what was entered not ""
Change to:<input type="text" name="updatedHeat" value="" style="width: 100px" />
<input type="button" id="ChangeHeatName" name="ChangeHeatName" value="Change" />
</section>
}
</div>
<div id="HeatGradeDiv" title="Change Heat Grade">
@using (Html.BeginForm("ChangeGrade", "Home", "POST"))
{
<section>
Heat Grade:<input type="text" name="grade" value="@Model.grade" style ="width:100px" readonly="true"/>
Change to:<input type="text" name="updatedGrade" value="" style="width: 100px" />
<input type ="hidden" name="hiddenHeat" value ="@Model.heatName)" />
<input type="button" id="ChangeGrade" name="ChangeGrade" value="Change" />
</section>
}
</div>
<div id="DeleteRecordDiv" title="Delete Record">
@using (Html.BeginForm("DeleteRecord", "Home", "POST"))
{
<section>
Heat Name:<input type="text" name="heatName" value="@Model.heatName" style ="width:100px" readonly="true"/>
<input type="button" id="DeleteRecordBtn" name="DeleteRecordBtn" value="Delete" />
</section>
}
</div>
事件处理程序绑定到原始按钮,该按钮被部分视图加载所取代。在此之后,它没有处理程序,直到您再次注册它或第一次将click处理程序注册到父DOM元素。
$(document).ready(function () {
// instead of this
$('#ChangeHeatName').click(function (e) {
...
});
// do this
$("body").on("click", "#ChangeHeatName", function(e) {
...
});
});
尝试用一个静态DOM元素替换"body"
,尽可能接近你重新加载的部分。
$("#ButtonsPartial").on("click", "#ChangeHeatName", function(e) {
...
});