由于之前学的数据回填大多数是弹出模态框进行数据的回填,类似要用到数据回填的功能是在修改或者详情等等中出现,然而对于跨页面的数据回填的了解不是很透切,而跨页面的数据回填是经常用到的,那么该如何实现跨页面的数据回填呢?接下来以一个跨页面修改回填数据的例子来讲。
效果图: 需要回填的数据有输入框和下拉框的数据
回填数据后的图:
再来看一下实现该效果的代码:
1、 首先要给跳转页面的按钮一个主键(ID),以便查询出那张表的具体数据。
function openUpdateModal(saleLndentID) {
window.location.href = "UpdateSellIndent?SaleLndentID=" + saleLndentID;
}
2、 在控制器中通过页面来接收传递过来的ID,保存到Session中以便传递回页面;
public ActionResult UpdateSellIndent(int? SaleLndentID)
{
Session["SaleLndentID"] = SaleLndentID;
return View();
}
3、在页面中通过传递的ID进行数据的回填。
在页面中记得在表单里面放隐藏的ID,即
<input type="hidden" name="SaleLndentID" id="SaleLndentID" value="" />
<script>
//获取SaleLndentID
var SaleLndentID = @Session["SaleLndentID"];
$(function () {
//根据ID查询数据
$.getJSON("SelectSaleLndentID?SaleLndentID="+SaleLndentID,function(data){
SaleLndentID = data[0].SaleLndentID;
//下拉框数据绑定&回填
//绑定经手人下拉框
createSelect("searchUserID","/HuiGuanHuo/InventoryArea/searchUser",data[0].UserID);
//绑定客户下拉框
createSelect("searchClientID","/HuiGuanHuo/LoanandLoanin/SelectClient",data[0].ClientID);
//绑定销售类型下拉框
createSelect("SelectSaleTypeID","/HuiGuanHuo/LoanandLoanin/SelectSaleType",data[0].SaleTypeID);
//绑定结算账户下拉框
createSelect("searchAccountID", "SelectAccount",data[0].AccountID);
$("#SaleLndentDeta").val(data[0].SaleLndentDeta); //业务日期
$("#SaleLndentElse").val(data[0].SaleLndentElse); //其它费用
$("#SaleLndentTotal").val(data[0].SaleLndentTotal); //总计金额
$("#SaleLndentEarnest").val(data[0].SaleLndentEarnest); //订金
$("#SaleLndentID").val(data[0].SaleLndentID); //销售ID
});
});
</script>
4、最后到控制器中查询数据。
public ActionResult SelectSaleLndentID(int SaleLndentID) {
var listSaleLndent = myModels.PW_SaleLndent.Where(m => m.SaleLndentID == SaleLndentID).ToList();
return Json(listSaleLndent, JsonRequestBehavior.AllowGet);
}
在这里你可以查询你想要回填的数据,写法不一,按实际情况而定。