您的位置：首页 > Web前端 > JavaScript

js获取gridview模板列中textbox行列的值

2014-10-29 15:46 190 查看

下面一个例子：在gridview中第一列输入数值，第二列输入数值，点击第三列的时候进行计算求和，如果不符合标记为红色字体。

如图：

代码：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function setClf(con) {
var table = document.getElementById("GridView1");
var tr = table.getElementsByTagName("tr");
//获取鼠标点击的元素
var e = event.srcElement;
//获取元素所在的行的行号（表头行号从0开始）。注意：parentElement只适用于IE浏览器，而parentNode则符合DOM标准。
//var rowIndex=e.parentElement.parentElement.rowIndex ;
var i = e.parentNode.parentNode.rowIndex; //获取GridView控件  分别获取选定行指定列的值
var a, b,c;

a = parseFloat(tr[i].getElementsByTagName("td")[0].getElementsByTagName("input")[0].value);
b = parseFloat(tr[i].getElementsByTagName("td")[1].getElementsByTagName("input")[0].value);

//上面为获取gridview中textbox的，如果为lable则如下写法
//  b = parseFloat(tr[i].getElementsByTagName("td")[1].getElementsByTagName("span")[0].innerText);

sum1 = a+b; //计算方法改变
c = parseFloat(tr[i].getElementsByTagName("td")[2].getElementsByTagName("input")[0].value);
if (sum1 != c) {
con.style.color = "Red";

}
else con.style.color = "black";

}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"
Width="100%" BackColor="White" BorderStyle="Solid" BorderWidth="1px" O>
<Columns>
<asp:TemplateField HeaderText="数据1">
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
<ItemTemplate>
<asp:TextBox ID="txt_bndy" runat="server" CssClass="tboxSearch_x" Width="50" Height="20"
Text='<%#  Eval("BNDY").ToString() %>' />
</ItemTemplate>
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
</asp:TemplateField>
<asp:TemplateField HeaderText="数据2">
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
<ItemTemplate>
<asp:TextBox ID="txt_bndj" runat="server" CssClass="tboxSearch_x" Width="50" Height="20"
Text='<%# Eval("BNDJ").ToString()%>' />
</ItemTemplate>
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
</asp:TemplateField>
<asp:TemplateField HeaderText="求和">
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
<ItemTemplate>
<asp:TextBox ID="txt_bnlj" runat="server" CssClass="tboxSearch_x" Width="50" Height="20"
Text='<%# Eval("BNLJ").ToString()%>' onBlur="setClf(this)" />
</ItemTemplate>
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#CCCC99" />
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<SelectedRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
</div>
</form>
</body>
</html>

后台：

protected void Page_Load(object sender, EventArgs e)
{
DataTable newdtb = new DataTable();
newdtb.Columns.Add("BNDJ");
newdtb.Columns.Add("BNDY");
newdtb.Columns.Add("BNLJ");

for (int i = 1; i < 11; i++)
{
DataRow newRow = newdtb.NewRow();
//newRow["BNDJ"] = "pro" + i.ToString();
//newRow["BNDY"] = 12.3m;
newdtb.Rows.Add(newRow);
}
GridView1.DataSource = newdtb;
GridView1.DataBind();
}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航