The DataGrid control should be a lot of widgets.ProgramTo briefly describe some of the useful functions.
Some simple applications of the DataGrid include the single choice of radio, multiple selection of checkbox, the color of moving the mouse over the row, and the multi-parameter passing through links. Here, both radio and checkbox use HTML controls.
Functions of the checkbox are as follows: select all, cancel the selection, and detect unselected operations. These functions are implemented using JS scripts.
Testdatagrid. ASPX pageCodeAs follows:
<% @ Page Language = "C #" codebehind = "testdatagrid. aspx. cs" autoeventwireup = "false" inherits = "testxml. testdatagrid" %>
<! Doctype HTML public "-// W3C // dtd html 4.0 transitional // en">
<HTML>
<Head>
<Title> </title>
<Meta name = "generator" content = "Microsoft Visual Studio. NET 7.1">
<Meta name = "code_language" content = "C #">
<Meta name = "vs_defaultclientscript" content = "JavaScript">
<Meta name = "vs_targetschema" content = "http://schemas.microsoft.com/intellisense/ie5">
<Script language = "JavaScript">
// Select all
Function quanxuan_click ()
{
If (document. form1.checkboxname. Length ){
For (VAR I = 0; I <document. form1.checkboxname. length; I ++ ){
Document. form1.checkboxname [I]. Checked = true;
}
} Else {
Document. form1.checkboxname. Checked = true;
}
}
// Deselect
Function quxiao_click ()
{
If (document. form1.checkboxname. Length ){
For (VAR I = 0; I <document. form1.checkboxname. length; I ++ ){
Document. form1.checkboxname [I]. Checked = false;
}
} Else {
Document. form1.checkboxname. Checked = false;
}
}
///////////// If no value is selected, false is returned.
Function maid ()
{
If (document. form1.checkboxname. Length ){
For (VAR I = 0; I <document. form1.checkboxname. length; I ++ ){
If (document. form1.checkboxname [I]. Checked)
{
Return true;
}
}
} Else {
If (document. form1.checkboxname. Checked)
{
Return true;
}
}
Alert ("select and try again! ");
Return false;
}
/// // Change the row color
If (! Objbeforeitem)
{
VaR objbeforeitem = NULL;
VaR objbeforeitembackgroundcolor = NULL;
}
Function itemover (OBJ)
{
Objbeforeitembackgroundcolor = obj. style. backgroundcolor;
OBJ. style. backgroundcolor = "# b9d1f3 ";
Objbeforeitem = OBJ;
}
Function itemout (OBJ)
{
If (objbeforeitem)
{
Objbeforeitem. style. backgroundcolor = objbeforeitembackgroundcolor;
}
}
</SCRIPT>
</Head>
<Body ms_positioning = "gridlayout">
<Form ID = "form1" method = "Post" runat = "server">
<Table>
<Tr>
<TD> <font face = ""> <asp: DataGrid id = "mydatagrid" runat = "server" width = "550px" allowpaging = "true" autogeneratecolumns = "false"
Onpageindexchanged = "mydatagrid_page" pagesize = "5" cellpadding = "2" horizontalalign = "Left" bordercolor = "gray"
Font-size = "14px" font-names = "">
<Alternatingitemstyle backcolor = "# f2f2f2"> </alternatingitemstyle>
<Itemstyle wrap = "false" horizontalalign = "Left" Height = "22px" verticalalign = "Middle"> </itemstyle>
<Headerstyle wrap = "false" Height = "25px" backcolor = "# dee6f6"> <Columns>
<Asp: boundcolumn visible = "false" datafield = "ID" sortexpression = "ID" headertext = "ID"> </ASP: boundcolumn>
<Asp: templatecolumn>
<Headertemplate>
Select
</Headertemplate>
<Itemtemplate>
<Input type = radio name = "radioname" value = '<% # databinder. eval (container. dataitem, "ID") %>'/>
</Itemtemplate>
</ASP: templatecolumn>
<Asp: templatecolumn>
<Headertemplate>
Select
</Headertemplate>
<Itemtemplate>
<Input type = "checkbox" name = "checkboxname" value = '<% # databinder. eval (container. dataitem, "ID") %>'>
</Itemtemplate>
</ASP: templatecolumn>
<Asp: templatecolumn>
<Headertemplate>
Template Column
</Headertemplate>
<Itemtemplate>
<Asp: Label id = "lblid" runat = "server" text = ''>
</ASP: Label>
<A href = "ABC. aspx? Id = <% # databinder. eval (container. dataitem, "ID") %> & name = <% # databinder. eval (container. dataitem, "name") %> "target =" _ blank "> connection </a>
</Itemtemplate>
</ASP: templatecolumn>
<Asp: hyperlinkcolumn datanavigateurlfield = "ID" datanavigateurlformatstring = "AA. aspx? Id = {0} "datatextfield =" name"
Sortexpression = "name" headertext = "name" target = "_ blank">
</ASP: hyperlinkcolumn>
<Asp: boundcolumn datafield = "card" sortexpression = "card" headertext = "ID card number" dataformatstring = "{0: yyyy-mm-dd hh: mm: SS} "> </ASP: boundcolumn>
<Asp: boundcolumn datafield = "price" sortexpression = "price" headertext = "price"> </ASP: boundcolumn>
<Asp: boundcolumn datafield = "Shijian" sortexpression = "Shijian" headertext = "Shijian" dataformatstring = "{0: Mm DD, yyyy}"> </ASP: boundcolumn>
</Columns>
<Pagerstyle mode = "numericpages"> </pagerstyle>
</ASP: DataGrid> </font> </TD>
</Tr>
<Tr>
<TD>
<Asp: button id = "button1" runat = "server" text = "radio"> </ASP: button>
<Input type = "button" value = "select all" onclick = "quanxuan_click ()">
<Input type = "button" value = "unselect" onclick = "quxiao_click ()">
<Asp: button id = "button2" runat = "server" text = "checkbox"> </ASP: button>
</TD>
</Tr>
</Table>
</Form>
</Body>
</Html>
The testdatagrid. aspx. CS code is as follows:
Using system;
Using system. collections;
Using system. componentmodel;
Using system. Data;
Using system. Data. sqlclient;
Using system. drawing;
Using system. Web;
Using system. Web. sessionstate;
Using system. Web. UI;
Using system. Web. UI. webcontrols;
Using system. Web. UI. htmlcontrols;
Using system. configuration;
Namespace testxml
{
/// <Summary>
/// Summary of testdatagrid.
/// </Summary>
Public class testdatagrid: system. Web. UI. Page
{
Protected system. Web. UI. webcontrols. radiobutton radiobutton1;
Protected system. Web. UI. webcontrols. Button button1;
Protected system. Web. UI. webcontrols. Button button2;
Protected system. Web. UI. webcontrols. DataGrid mydatagrid;
Private void page_load (Object sender, system. eventargs E)
{
// Place user code here to initialize the page
If (! Ispostback)
{
Bindgrid ();
}
Button2.attributes. Add ("onclick", "Return maid ();");
}
Public void mydatagrid_page (Object sender, datagridpagechangedeventargs E)
{
Mydatagrid. currentpageindex = E. newpageindex;
Bindgrid ();
}
Private void bindgrid ()
{
String strsql = "";
Dataset DS = new dataset ();
Strsql = "select * From testdg ";
Sqlconnection conn = new sqlconnection (configurationsettings. receivettings ["connstr"]);
If (conn. state. tostring () = "closed ")
{
Conn. open ();
}
Sqldataadapter da = new sqldataadapter (strsql, Conn );
Da. Fill (DS, "TT ");
Mydatagrid. datasource = Ds. Tables ["TT"]. defaultview;
Mydatagrid. databind ();
Da. Dispose ();
If (conn. state. tostring () = "open ")
{
Conn. Close ();
}
Conn. Dispose ();
}
Private void mydatagrid_itemcreated (Object sender, system. Web. UI. webcontrols. datagriditemeventargs E)
{
// Use the foreground script to move the cursor over each line to change the color. // use the foreground script to move the cursor over each line to change the color.
# Region
If (E. Item. itemindex> = 0)
{
E. Item. Attributes. Add ("onmouseover", "itemover (this )");
E. Item. Attributes. Add ("onmouseout", "itemout (this )");
}
# Endregion
}
# Code generated by region web Form Designer
Override protected void oninit (eventargs E)
{
//
// Codegen: This call is required by the ASP. NET web form designer.
//
Initializecomponent ();
Base. oninit (E );
}
/// <Summary>
/// The designer supports the required methods-do not use the code editor to modify
/// Content of this method.
/// </Summary>
Private void initializecomponent ()
{
This. mydatagrid. itemcreated + = new system. Web. UI. webcontrols. datagriditemeventhandler (this. mydatagrid_itemcreated );
This. button1.click + = new system. eventhandler (this. button#click );
This. button2.click + = new system. eventhandler (this. button2_click );
This. Load + = new system. eventhandler (this. page_load );
}
# Endregion
Private void button#click (Object sender, system. eventargs E)
{
Page. response. Write (page. Request. Form. Get ("radioname "));
}
Private void button2_click (Object sender, system. eventargs E)
{
String STR = "";
String [] ckb = NULL;
STR = page. Request. Form. Get ("checkboxname ");
Ckb = Str. Split (New char [] {','});
;
Page. response. Write ("the value obtained directly on the page is:" + STR + "<br> ");
Page. response. Write ("stored in the array after processing, as follows: <br> ");
For (INT I = 0; I <ckb. length; I ++)
{
Page. response. Write ("ckb [" + I + "] value:" + ckb [I] + "<br> ");
}
}
}
}
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
