一个很好用的表格直接修改交互数据库的JS(通用)
前提:引用JQUERY 表格遵循一定的规格 本人闲暇时写的,有不懂的可以加QQ:609651658JS通用代码:
<script type="text/javascript">
//tableId:DataGrid的ID url:ajax请求路径
function savetable(tableId, url) {
var alls = [];
var tb = document.getElementById(tableId);
var rows = tb.rows.length;
var cells = tb.rows[0].cells.length;
for (var i = 1; i < rows; i++) {
var json = "";
var isupdate = false;
for (var k = 1; k < cells; k++) {
var newvalue = tb.rows[i].cells[k].getElementsByTagName("input")[0].value; //新值
var oldvalues = tb.rows[i].cells[k].getElementsByTagName("input")[1].value; //旧值*键名
var oldvalue = oldvalues.split("*")[0]; //旧值
if (newvalue != oldvalue) {
isupdate = true;
continue;
}
}
if (isupdate == true) {
for (var j = 1; j < cells; j++) {
var newvalue = tb.rows[i].cells[j].getElementsByTagName("input")[0].value; //新值
var oldvalues = tb.rows[i].cells[j].getElementsByTagName("input")[1].value;//旧值*键名
var keyname = oldvalues.split("*")[1]; //键名
var oldvalue = oldvalues.split("*")[0]; //旧值
// var datefield = TB.rows[i].cells[j].getElementsByTagName("input")[2].value;
var id = tb.rows[i].cells[0].getElementsByTagName("input")[0].value;
json += "\"" + keyname + "\":\"" + newvalue + "\",";
}
json = "\{\"GUID\":\"" + id + "\"," + json;
json = json.substring(0, json.length - 1) + "\}";
alls.push(json);
}
}
//判断是否修改过
if (alls.length == 0) {
alert("您没有修改表格!");
return;
}
alls = "{\"arrays\":[" + alls + "]}";
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
url: url, //传入后台的地址/方法
data: alls, //参数,这里是一个json语句
success: function (result) {
if (result.toString() == "0") {
alert("未能成功!请检查输入!!");
}
else {
alert("更改成功!");
document.location.reload(); //重新加载当前页面
}
}
});
}
</script>
表格代码:
<asp:DataGrid ID="DataGrid" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:TemplateColumn HeaderText="序号">
<HeaderStyle HorizontalAlign="center" />
<ItemStyle HorizontalAlign="center"></ItemStyle>
<ItemTemplate>
<%# this.Pager.PageSize * (this.Pager.CurrentPageIndex - 1) + this.DataGrid.Items.Count + 1%>
<asp:HiddenField ID="hidGuid" runat="server" Value='<%# Convert.ToString(DataBinder.Eval(Container, "DataItem.GUID"))%>' />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="转关单号">
<HeaderStyle HorizontalAlign="center" />
<ItemStyle HorizontalAlign="center"></ItemStyle>
<ItemTemplate>
<cc1:TextBox ID="txtZGDH" runat="server" Text=' <%# DataBinder.Eval(Container, "DataItem.TRANS_NO")%>'></cc1:TextBox>
<asp:HiddenField ID="hidZGDH" Value='<%# Convert.ToString(DataBinder.Eval(Container, "DataItem.TRANS_NO"))+"*TRANS_NO"%>'
runat="server" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="申报单位">
<HeaderStyle HorizontalAlign="center" Width="230px" />
<ItemStyle HorizontalAlign="center"></ItemStyle>
<ItemTemplate>
<span style="font: 13px;">
<cc1:TextBox ID="txtSBDW" runat="server" Text='<%# Convert.ToString(DataBinder.Eval(Container, "DataItem.AGENT_COMP_NAME"))%>'></cc1:TextBox>
<asp:HiddenField ID="hidSBDW" Value='<%# Convert.ToString(DataBinder.Eval(Container, "DataItem.AGENT_COMP_NAME"))+"*AGENT_COMP_NAME"%>'
runat="server" />
</span>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="备注">
<HeaderStyle HorizontalAlign="center" />
<ItemStyle HorizontalAlign="center"></ItemStyle>
<ItemTemplate>
<cc1:TextBox ID="txtBZ" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.REMARK")%>'>
</cc1:TextBox>
<asp:HiddenField ID="hidBZ" Value='<%# Convert.ToString(DataBinder.Eval(Container, "DataItem.REMARK"))+"*REMARK"%>'
runat="server" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="空箱数">
<HeaderStyle HorizontalAlign="center" />
<ItemStyle HorizontalAlign="left"></ItemStyle>
<ItemTemplate>
<cc1:TextBox ID="txtKXS" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.EMPTY_NUM")%>'></cc1:TextBox>
<asp:HiddenField ID="hidKXS" Value='<%# Convert.ToString(DataBinder.Eval(Container, "DataItem.EMPTY_NUM"))+"*EMPTY_NUM"%>'
runat="server" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="总件数">
<HeaderStyle HorizontalAlign="center" />
<ItemStyle HorizontalAlign="left"></ItemStyle>
<ItemTemplate>
<cc1:TextBox ID="txtKXS" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.TOTAL_PIECE")%>'></cc1:TextBox>
<asp:HiddenField ID="hidKXS" Value='<%# Convert.ToString(DataBinder.Eval(Container, "DataItem.TOTAL_PIECE"))+"*TOTAL_PIECE"%>'
runat="server" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="境内运输航次">
<HeaderStyle HorizontalAlign="center" />
<ItemStyle HorizontalAlign="left"></ItemStyle>
<ItemTemplate>
<cc1:TextBox ID="txtKXS" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.TRAFFIC_TOOL_VOYAGE")%>'></cc1:TextBox>
<asp:HiddenField ID="hidKXS" Value='<%# Convert.ToString(DataBinder.Eval(Container, "DataItem.TRAFFIC_TOOL_VOYAGE"))+"*TRAFFIC_TOOL_VOYAGE"%>'
runat="server" />
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
后台代码:
[WebMethod]
public static string GetJson(Dictionary<string, string>[] arrays)
{
for (int i = 0; i <arrays.Length; i++)
{
//获取主键ID
CusAppTransTopEntity top = new CusAppTransTopEntity();
top.Guid = arrays[i]["GUID"];
top.TransNo = arrays[i]["TRANS_NO"];
top.AgentCompName = arrays[i]["AGENT_COMP_NAME"];
top.Remark = arrays[i]["REMARK"];
top.EmptyNum = double.Parse(arrays[i]["EMPTY_NUM"]);
top.TotalPiece = double.Parse(arrays[i]["TOTAL_PIECE"]);
top.TrafficToolVoyage = arrays[i]["TRAFFIC_TOOL_VOYAGE"];
new CusAppTransaction().UPdatBT(top);
//最后执行更新
}
return "1";
}
--------------------编程问答-------------------- http://ligerui.com/我一般去官网学习的 --------------------编程问答-------------------- --------------------编程问答--------------------
楼主V5 --------------------编程问答-------------------- 代码可能有点乱,我说下处理原理吧,首先我通过JS逐个比对文本框值和隐藏控件保存原来的值判断是否被修改过,如果修改过了,会拼接一个JSON格式的字符串,通过AJAX传入后台,后台解析后从而保存至数据库,返回页面保存结果,刷新页面 调用savetable()这个方法时,只需要传一个TABLE的ID和AJAX请求路径即可
补充:.NET技术 , ASP.NET