DataGrid last time, we implemented for this DataGrid to add, delete, modify, paging, dynamic modify the content and other functions, today to analyze how to add their own, radio, multiple selection function.
First look at the code that needs to be added on the previous basis:
(1) Realization of self-added column
Only need to add a template column in the foreground, bind itemindex+1 on it
<asp:templatecolumn headertext= "Choice" >
<ItemTemplate>
<%# container.itemindex+1%>
</ItemTemplate>
</asp:TemplateColumn>
(2) To achieve a single election
Based on the above, add a radio to this column
<asp:templatecolumn headertext= "Choice" >
<ItemTemplate>
<%# container.itemindex+1%>
<input type=radio name= "rad" value= ' <%# container.itemindex+1%> ' >
</ItemTemplate>
</asp:TemplateColumn>
The value of the radio is the 1-pagesize of the self increment.
Then create a button (called a radio) to add the following code
This. Label1.Text = "Selected line number:" + request.form["Rad"]. ToString ();
Such a simple step although the implementation of the display of the selected line number, but after the button is pressed, radio's choice is not to be retained, because this radio is not runat=server, we need to place a hidden field for this page (such as runat= Server) to save selected radio when clicking a button, add <input type= "hidden" id= "rd" runat= "R" name= "rd" > in the foreground (note, Don't add this to the DataGrid), and then add Rd to the button just now. Value = request.form["Rad"]. ToString () (if Vs.net does not declare for this htmlinputhidden yourself add protected System.Web.UI.HtmlControls.HtmlInputHidden Rd;). Until now the position has not been completed, although the HtmlInputHidden has saved the selected line number, but also need to be in the page Load when the radio for the selected state, modify Page_Load () for
private void Page_Load (object sender, System.EventArgs e)
{
String js = "";
js+= "<script>\r\n";
js+= "function ld () {\ r \ n";
js+= "for (I=0;i<document.getelementsbyname (' rad '). length;i++) \ r \ n";
js+= "If" (Document.getelementsbyname (' rad ') [i].value==];
js+= "document.getElementById (' + This.rd.ClientID +" '). Value) ";
js+= "Document.getelementsbyname (' rad ') [i].checked=true\r\n";
js+= "}\r\n";
js+= "window.onload=ld\r\n";
js+= "</script>\r\n";
This. RegisterStartupScript ("JS", JS);
if (! IsPostBack)
{
Setbind ();
}
}
The following is an analysis of the above code:
Q: Why not put the code in the IF (! IsPostBack)?
A: Do not release need to be clear if (! IsPostBack) meaning (see http://blog.csdn.net/lovecherry/archive/2005/02/25/301441.aspx in detail), in fact, it should be put this code to the IF (! IsPostBack) {}else{put here}, because the first time the page loaded, hidden domain inside is impossible to have something (the first load page you choose and click the button to submit, how can there be anything?) ）
Q: What is \ r \ n?
A: This is a line, do not right side code to run without impact, but if you put the line, the client can be more clearly presented
Q: Why take the value of RD with document.getElementById (' + This.rd.ClientID + '). Value is not document.getElementById (' Rd '). What about value?
A: In fact here you can the latter, but to know that the RD is the server side of the control, in some cases, the ID in the client's rendering is not in the ASPX you specify the ID, but the control. ClientID, such as some server-side controls placed in a DataGrid, look at the source code to see that the ID is similar to the DATAGRID1__CTL5_HYPERLINK1 rather than the ID you specified.
Q: Why not use RegisterClientScriptBlock here?
A: Here, this is also indifferent you can use RegisterClientScriptBlock, because this section of JS is run (js+= "window.onload=ld\r\n"; So neither the beginning nor the end of the form will affect the result.
(3) Implement multiple selection
First add the following code to the foreground (adding a column)
<asp:TemplateColumn>
<ItemTemplate>
<input type= "hidden" id= "Selectedid" runat= "Server"
Value= ' <%# container.itemindex%> ' name= ' Selectedid '/>
<asp:checkbox id= "Chkexport" runat= "Server"/>
</ItemTemplate>
</asp:TemplateColumn>
Add the following code to the page by adding a button (called multiple selections)
foreach (DataGridItem di in this.) Datagrid1.items)
{
if ((CheckBox) di. FindControl ("Chkexport")). Checked==true)
{
This. Label1.text+=this. Datagrid1.datakeys[int. Parse ((HtmlInputHidden) di. FindControl ("Selectedid")). Value)]+ "<br>";
}
}
Click on this button in the label location shows all the selected items corresponding to the value of the table primary key, you can use this value to do some database operations
You can add another two buttons, one is called Select All, one is called Cancel all the selections, add the following code separately
foreach (DataGridItem di in this.) Datagrid1.items)
{
(CheckBox) di. FindControl ("Chkexport")). Checked=true;
}
foreach (DataGridItem di in this.) Datagrid1.items)
{
(CheckBox) di. FindControl ("Chkexport")). Checked=false;
}
The above code is analyzed below:
Q: Select All and Cancel all selected buttons are submitted to the server, can not submit implementation?
A: First of all, the template column in the checkbox is Runat=server, said above, the client's rendering ID is similar to datagrid1__ctl9_chkexport such, so in the client JS fetch when we can only through the control. ClientID to fetch, if the Page_Load in the time to take the words are not, because the checkbox is placed in the DataGrid template column, in the Page_Load when the DataGrid has not created. The solution is to use a single server-side hidden field to hold multiple selected items, and then replace the <asp:CheckBox> in the template column with the HTML CheckBox and change the value in the hidden field at the time of the selection (through JS, So will not submit the page), also in the click of the radio button, by reading the hidden field of the value to get the selected item, this is actually a code to the server-oriented to the client-oriented a transformation, in some cases, server and client interaction through hidden domain is very convenient. Cross-page multiple selections are given in detail in subsequent articles, as well as examples of client selection and cancellation of all selections.
