JavaScript操作服务器控件之Gridview控件
1.JavaScript脚本如下:
<script language="javascript" type="text/javascript">
function gridviewControl()
{
//获取GridView的客户端元素
var table=document.getElementById("GridView1");
//获取第5列(Test_Column,从0开始)的列标题
var title = table.getElementsByTagName("th")[5].innerText;
//循环访问第Test_Column中的控件
for(var i=1;i<table.rows.length;i++)
{
//获取第一个TextBox
var txt1 = table.rows[i].cells[5].getElementsByTagName("INPUT")[0];
//获取第二个TextBox
var txt2 = table.rows[i].cells[5].getElementsByTagName("INPUT")[1];
//获取 CheckBox
var chkItem = table.rows[i].cells[5].getElementsByTagName("input")[2];
//获取第一个DropDownList
var ddlItem = table.rows[i].cells[5].getElementsByTagName("select")[0];
//获取第二个DropDwonList
var ddlItem2 = table.rows[i].cells[5].getElementsByTagName("select")[1];
//测试结果
alert("Title Name is " + title
+ ", /t/n 第一个TextBox的值 " + txt1.value
+ ", /t/n 第二个TextBox的值 " + txt2.value
+ ", /t/n CheckBox的选项值 " + (chkItem.checked ? 'true' : 'false')
+ ", /t/n 第一个DropDownList的选项值是: " + ddlItem.value
+ ", /t/n 第二个DropDownList的选项值是: " + ddlItem2.value);
}
}
</script>
2.aspx代码如下:
- <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TestWeb._Default" %>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" >
- <head runat="server">
- <title>Untitled Page</title>
- <mce:script language="javascript" type="text/javascript"><!--
- function gridviewControl()
- {
- //获取GridView的客户端元素
- var table=document.getElementById("GridView1");
- //获取第5列(Test_Column,从0开始)的列标题
- var title = table.getElementsByTagName("th")[5].innerText;
- //循环访问第Test_Column中的控件
- for(var i=1;i<table.rows.length;i++)
- {
- //获取第一个TextBox
- var txt1 = table.rows[i].cells[5].getElementsByTagName("INPUT")[0];
- //获取第二个TextBox
- var txt2 = table.rows[i].cells[5].getElementsByTagName("INPUT")[1];
- //获取 CheckBox
- var chkItem = table.rows[i].cells[5].getElementsByTagName("input")[2];
- //获取第一个DropDownList
- var ddlItem = table.rows[i].cells[5].getElementsByTagName("select")[0];
- //获取第二个DropDwonList
- var ddlItem2 = table.rows[i].cells[5].getElementsByTagName("select")[1];
- //测试结果
- alert("Title Name is " + title
- + ", /t/n 第一个TextBox的值 " + txt1.value
- + ", /t/n 第二个TextBox的值 " + txt2.value
- + ", /t/n CheckBox的选项值 " + (chkItem.checked ? 'true' : 'false')
- + ", /t/n 第一个DropDownList的选项值是: " + ddlItem.value
- + ", /t/n 第二个DropDownList的选项值是: " + ddlItem2.value);
- }
- }
- // --></mce:script>
- </head>
- <body>
- <form id="form1" runat="server">
- <div style="float:left;width:200px;">
- <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
- onrowcreated="GridView1_RowCreated">
- <Columns>
- <asp:BoundField HeaderText="CH1" />
- <asp:BoundField HeaderText="CH2" />
- <asp:BoundField DataField="Column1" HeaderText=" Column1 " />
- <asp:BoundField DataField="Column2" HeaderText=" Column2 " />
- <asp:BoundField DataField="Column3" HeaderText=" Column3 " />
- <asp:TemplateField HeaderText=" Test_Column " >
- <ItemTemplate>
- <asp:TextBox ID="gdvTxtValue" runat="server" Text='<%# Bind("txtData1") %>'></asp:TextBox>
- <br />
- <asp:TextBox ID="gdvTxtItem" runat="server" Text='<%# Bind("txtData2") %>' BackColor="LightBlue"></asp:TextBox>
- <br />
- <asp:CheckBox ID="gdvchkValue" runat="server" Text='<%# Bind("chkData1") %>' Enabled='<%# Bind("chkEnableData1") %>'/>
- <br />
- <asp:DropDownList ID="ddlItem" runat="server" >
- <asp:ListItem Selected="True"></asp:ListItem>
- <asp:ListItem Text="I'm No.11" Value="No.11"></asp:ListItem>
- <asp:ListItem Text="I'm No.12" Value="No.12"></asp:ListItem>
- </asp:DropDownList>
- <br />
- <asp:DropDownList ID="ddlItem2" runat="server">
- <asp:ListItem Selected="True"></asp:ListItem>
- <asp:ListItem Text="I'm No.21" Value="No.21"></asp:ListItem>
- <asp:ListItem Text="I'm No.22" Value="No.22"></asp:ListItem>
- </asp:DropDownList>
- </ItemTemplate>
- </asp:TemplateField>
- </Columns>
- </asp:GridView>
- <%--<asp:SqlDataSource ID="SqlDataSource1" runat="server"
- ConnectionString="<%$ ConnectionStrings:PMConnectionString %>"
- SelectCommand="SELECT * FROM [AP_TRANS]"></asp:SqlDataSource>
- <br /><%--DataSourceID="SqlDataSource1"--%>
- <br />
- </div>
- <div style="position:absolute;left:450px;">
- <asp:DropDownList ID="DropDownList1" runat="server" Visible="false" AutoPostBack="True"
- Height="16px" onselectedindexchanged="DropDownList1_SelectedIndexChanged"
- Width="149px">
- <asp:ListItem></asp:ListItem>
- <asp:ListItem Value="VAlue1">1</asp:ListItem>
- <asp:ListItem Value="value2">2</asp:ListItem>
- <asp:ListItem Value="value3">3</asp:ListItem>
- <asp:ListItem></asp:ListItem>
- </asp:DropDownList>
- <asp:Label ID="Label1" runat="server" Text="Label" Visible="false" Width="200px"></asp:Label>
- <asp:Button ID="Button1" runat="server" Text="Button" Visible="false" OnClientClick="gridviewControl()"/>
- <br />
- <input type="button" id="btnTest" value="Test_Button" onclick="gridviewControl()" />
- </div>
- </form>
- </body>
- </html>
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TestWeb._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<mce:script language="javascript" type="text/javascript"><!--
function gridviewControl()
{
//获取GridView的客户端元素
var table=document.getElementById("GridView1");
//获取第5列(Test_Column,从0开始)的列标题
var title = table.getElementsByTagName("th")[5].innerText;
//循环访问第Test_Column中的控件
for(var i=1;i<table.rows.length;i++)
{
//获取第一个TextBox
var txt1 = table.rows[i].cells[5].getElementsByTagName("INPUT")[0];
//获取第二个TextBox
var txt2 = table.rows[i].cells[5].getElementsByTagName("INPUT")[1];
//获取 CheckBox
var chkItem = table.rows[i].cells[5].getElementsByTagName("input")[2];
//获取第一个DropDownList
var ddlItem = table.rows[i].cells[5].getElementsByTagName("select")[0];
//获取第二个DropDwonList
var ddlItem2 = table.rows[i].cells[5].getElementsByTagName("select")[1];
//测试结果
alert("Title Name is " + title
+ ", /t/n 第一个TextBox的值 " + txt1.value
+ ", /t/n 第二个TextBox的值 " + txt2.value
+ ", /t/n CheckBox的选项值 " + (chkItem.checked ? 'true' : 'false')
+ ", /t/n 第一个DropDownList的选项值是: " + ddlItem.value
+ ", /t/n 第二个DropDownList的选项值是: " + ddlItem2.value);
}
}
// --></mce:script>
</head>
<body>
<form id="form1" runat="server">
<div style="float:left;width:200px;">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
onrowcreated="GridView1_RowCreated">
<Columns>
<asp:BoundField HeaderText="CH1" />
<asp:BoundField HeaderText="CH2" />
<asp:BoundField DataField="Column1" HeaderText=" Column1 " />
<asp:BoundField DataField="Column2" HeaderText=" Column2 " />
<asp:BoundField DataField="Column3" HeaderText=" Column3 " />
<asp:TemplateField HeaderText=" Test_Column " >
<ItemTemplate>
<asp:TextBox ID="gdvTxtValue" runat="server" Text='<%# Bind("txtData1") %>'></asp:TextBox>
<br />
<asp:TextBox ID="gdvTxtItem" runat="server" Text='<%# Bind("txtData2") %>' BackColor="LightBlue"></asp:TextBox>
<br />
<asp:CheckBox ID="gdvchkValue" runat="server" Text='<%# Bind("chkData1") %>' Enabled='<%# Bind("chkEnableData1") %>'/>
<br />
<asp:DropDownList ID="ddlItem" runat="server" >
<asp:ListItem Selected="True"></asp:ListItem>
<asp:ListItem Text="I'm No.11" Value="No.11"></asp:ListItem>
<asp:ListItem Text="I'm No.12" Value="No.12"></asp:ListItem>
</asp:DropDownList>
<br />
<asp:DropDownList ID="ddlItem2" runat="server">
<asp:ListItem Selected="True"></asp:ListItem>
<asp:ListItem Text="I'm No.21" Value="No.21"></asp:ListItem>
<asp:ListItem Text="I'm No.22" Value="No.22"></asp:ListItem>
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<%--<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:PMConnectionString %>"
SelectCommand="SELECT * FROM [AP_TRANS]"></asp:SqlDataSource>
<br /><%--DataSourceID="SqlDataSource1"--%>
<br />
</div>
<div style="position:absolute;left:450px;">
<asp:DropDownList ID="DropDownList1" runat="server" Visible="false" AutoPostBack="True"
Height="16px" onselectedindexchanged="DropDownList1_SelectedIndexChanged"
Width="149px">
<asp:ListItem></asp:ListItem>
<asp:ListItem Value="VAlue1">1</asp:ListItem>
<asp:ListItem Value="value2">2</asp:ListItem>
<asp:ListItem Value="value3">3</asp:ListItem>
<asp:ListItem></asp:ListItem>
</asp:DropDownList>
<asp:Label ID="Label1" runat="server" Text="Label" Visible="false" Width="200px"></asp:Label>
<asp:Button ID="Button1" runat="server" Text="Button" Visible="false" OnClientClick="gridviewControl()"/>
<br />
<input type="button" id="btnTest" value="Test_Button" onclick="gridviewControl()" />
</div>
</form>
</body>
</html>
3.aspx.cs文件代码如下:
- using System;
- using System.Collections;
- using System.Configuration;
- using System.Data;
- using System.Linq;
- using System.Web;
- using System.Web.Security;
- using System.Web.UI;
- using System.Web.UI.HtmlControls;
- using System.Web.UI.WebControls;
- using System.Web.UI.WebControls.WebParts;
- using System.Xml.Linq;
- namespace TestWeb
- {
- public partial class _Default : System.Web.UI.Page
- {
- protected void Page_Load(object sender, EventArgs e)
- {
- //DataTable
- DataTable Record = new DataTable();
- Record.Columns.Add("Column1", typeof(int));
- Record.Columns.Add("Column2", typeof(string));
- Record.Columns.Add("Column3", typeof(string));
- Record.Columns.Add("txtData1", typeof(string));
- Record.Columns.Add("txtData2", typeof(string));
- Record.Columns.Add("chkData1", typeof(bool));
- Record.Columns.Add("chkEnableData1", typeof(bool));
- for (int i = 0; i < 5; i++)
- {
- Record.Rows.Add();
- Record.Rows[i]["Column1"] = i + 1;
- Record.Rows[i]["Column2"] = "参照列1";
- Record.Rows[i]["Column3"] = "参照列2";
- Record.Rows[i]["txtData1"] = "Data of Box1-" + i.ToString();
- Record.Rows[i]["txtData2"] = "Data of Box2-" + i.ToString();
- Record.Rows[i]["chkData1"] = true;
- Record.Rows[i]["chkEnableData1"] = true;
- }
- GridView1.DataSource = Record;
- GridView1.DataBind();
- }
- protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
- {
- //e.Row.Cells[0].Visible = false;
- e.Row.Cells[0].Style.Add("display", "none");
- e.Row.Cells[1].Style.Add("display", "none");
- }
- protected void l2131l()
- {
- //string onclick =" ScriptName=ReturnThsSearch_0&"
- // + " tableId=&valueCount=0&Imode=0', null, 'left=400, top=100, status=no, toolbar= no, location= no, menubar= no ,height=550,width=670');";
- //string onclick =" ScriptName=ReturnSearchVendor_0&"
- //+ " WS_CD=&Imode=1', null, 'left=400, top=100, status=no, toolbar= no, location= no, menubar= no ,height=550,width=660');";
- }
- protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
- {
- this.Label1.Text = DropDownList1.Text;
- }
- protected void Button1_Click(object sender, EventArgs e)
- {
- this.Label1.Text = DropDownList1.SelectedItem.Text + "-" + DropDownList1.SelectedItem.Value;
- for (int i = 0; i < this.DropDownList1.Items.Count; i++)
- {
- string ttt = this.DropDownList1.Items[0].Text + DropDownList1.Items[i].Value;
- }
- }
- }
- }
--------------------- 本文来自 goforwarder 的CSDN 博客 ,全文地址请点击:https://blog.csdn.net/yd2005zxq/article/details/5613262?utm_source=copy
JavaScript操作服务器控件之Gridview控件的更多相关文章
- 027. asp.net中数据绑定控件之 GridView控件
GridView控件支持下面的功能: 绑定至数据源控件, 如SqlDataSource 内置排序功能 内置更新和删除功能 内置分页功能 内置行选择功能 可以编程方式访问GridView对象模型以动态设 ...
- C#操作GridView控件
GridView控件是一个visualStudio自带的数据控件,它可以非常快速的将数据以表格方式显示在web页面上.下面就是一个利用GridView控件进行数据绑定的小例子,内容如下: 数据来源自一 ...
- Repeater, DataList, 和GridView控件的区别
http://blog.sina.com.cn/s/blog_646dc75c0100h5p6.html http://www.cnblogs.com/phone/archive/2010/09/15 ...
- .NET中使用GridView控件输入数据时出现“ Index was out of range. Must be non-negative and less than the size of the collection. Parameter name: index"的问题
在.NET中使用GridView控件的在线编辑数据时,出现了“ Index was out of range. Must be non-negative and less than the size ...
- 数据绑定技术一:GridView控件
在网站或应用程序中,要显示数据信息,可用到ASP.NET提供的数据源控件和能够显示数据的控件. 一.数据源控件 数据源控件用于连接数据源.从数据源中读取数据以及把数据写入数据源. 1.数据源控件特点 ...
- 扩展GridView控件——为内容项添加拖放及分组功能
引言 相信大家对GridView都不陌生,是非常有用的控件,用于平铺有序的显示多个内容项.打开任何WinRT应用或者是微软合作商的网站,都会在APP中发现GridView的使用.“Tiles”提供了一 ...
- .Net语言 APP开发平台——Smobiler学习日志:用Gridview控件设计较复杂的表单
最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台,也许比Xamarin更方便 一.目标样式 我们要实现上图中的效果,需要如下的操作: 1.从工具栏上的”Smobil ...
- GRIDVIEW 控件
http://www.cnblogs.com/shanymen/archive/2009/05/22/1486654.html GridView控件是.net里的一个显示数据控件,该控件制作很人性化, ...
- asp.net GridView控件的列属性
BoundField 默认的数据绑定类型,通常用于显示普通文本 CheckBoxField 显示布尔类型的数据.绑定数据为TRUE时,复选框数据绑定列为选中状态:绑定数据为FALSE时,则显示未选中状 ...
随机推荐
- maven snapshot和release版本的区别(转)
在使用maven过程中,我们在开发阶段经常性的会有很多公共库处于不稳定状态,随时需要修改并发布,可能一天就要发布一次,遇到bug时,甚至一天要发布N次.我们知道,maven的依赖管理是基于版本管理的, ...
- 如何解决安装好的google浏览器打不开网页的问题?
1.Google浏览器右上角,三个点,点击一下, 2.点击设置 3.在"搜索引擎"这一栏,选择'管理搜索引擎',右边的倒三角,进入选择界面 4.在其他搜索引擎中选择"百度 ...
- 我的Java开发学习之旅------>使用Working Setst将Eclipse中的项目分类使项目一目了然
今天发现Eclipse中若有太多的项目,杂七杂八的,看起来会非常的痛苦.今天请教公司的前辈学会了一个方法,在Eclipse中,当项目比较多的时候,我们可以用WorkingSet将这些项目分类,把相关连 ...
- python cookbook第三版学习笔记十四:类和对象(五)代理类以及内存回收
代理类: 代理类的作用其实有继承有些类似,如果你想将某个实例的属性访问代理到内部另外一个实例中去,可以用继承也可以用代理.来看下代理的应用: class A: def spam(self,x) ...
- Mysql 外键级联
如果表A的主关键字是表B中的字段,则该字段称为表B的外键,表A称为主表,表B称为从表.外键是用来实现参照完整性的,不同的外键约束方式将可以使两张表紧密的结合起来,特别是修改或者删除的级联操作将使得日常 ...
- Java for LeetCode 132 Palindrome Partitioning II
Given a string s, partition s such that every substring of the partition is a palindrome. Return the ...
- java.sql.SQLException: Illegal connection port value '3306:success'
严重: Servlet.service() for servlet jsp threw exceptionjava.sql.SQLException: Illegal connection port ...
- 不使用 spring-boot-starter-parent 构建 spring boot 应用
创建 spring-boot 应用通用方法是配置 pom.xml,定义 为 spring-boot-start-parent.如下: <parent> <groupId>org ...
- LightOJ - 1274 Beating the Dataset —— 期望
题目链接:https://vjudge.net/problem/LightOJ-1274 1274 - Beating the Dataset PDF (English) Statistics ...
- Spring Boot2.0之 整合JDBC
很入门的知识,大家了解下就OK maven配置文件pom: spring: datasource: url: jdbc:mysql://localhost:3306/test username: ro ...