Methods for using RadioButton radio buttons in the ASP.net gridview-practical tips

The example in this article describes the method for using the RadioButton radio button in the ASP.net gridview. Share to everyone for your reference, specific as follows:

I made a radio button in the GridView, and I used three different methods.

The first method: Add server-side control RadioButton in the template column of the GridView, and use JS to control the radio

Using Template columns Riga RadioButton

<script type= "Text/javascript" >
 function Setradio (nowradio)
 {
 var myform,objradio;
 Myform=document.forms[0];
 /**////alert (myForm);
 for (Var i=0;i<myform.length;i++)
 {
 if (myform.elements[i].type== "Radio")
 {
 objradio= Myform.elements[i];
 /**////alert (objradio.name);
 if (Objradio!=nowradio && objRadio.name.indexOf ("GridView1") >-1 && objRadio.name.indexOf (" RadioButton1 ") >-1)
 {
 alert (objradio.name);
 if (objradio.checked)
 {
 objradio.checked=false
}}}}} </script>

<asp:gridview id= "GridView1" runat= "Server" autogeneratecolumns= "false" Showheader= "false" onrowdatabound= " GridView1_RowDataBound ">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:radiobutton id= "RadioButton1" runat= "server"/>
</ItemTemplate>
</asp:templatefield >
</Columns>
</asp:GridView>
<asp:button id= "Button1" runat= "server" text= "Fetch options" onclick= "Button1_Click"/>
<asp:label id= "Label1" runat= "Server" ></asp:Label>

The preceding piece of code is the control of the single selection of JS, here, I used to traverse all the controls on the page method, added the condition, is the red that judge, only control GridView1 ID is RadioButton1 generated radio button

This approach requires binding client events

protected void GridView1_RowDataBound (object sender, GridViewRowEventArgs e)
{
// Bind Setradio Event
try
{(
RadioButton) E.row.findcontrol ("RadioButton1") to each RadioButton1. Attributes.Add ("onclick", "Setradio (This)");
}
catch (Exception)
{}
}

The value method is to traverse each row of the GridView, taking the selected control

protected void Button1_Click (object sender, EventArgs e)
{
//Use template column riga RadioButton
label1.text = "";
foreach (GridViewRow gvr in gridview1.rows)
{
try
{
if ((RadioButton) gvr. FindControl ("RadioButton1")). Checked)
{
Label1.Text = "currently selected" + convert.tostring (GVR. RowIndex + 1) + "a";
break;
}
}
catch (Exception)
{}
}
if (Label1.Text.Length = = 0)
{
Label1.Text = "No selected items";
}
}

This approach, both on the client and server side, uses the traversal

The second method: in the template column of the GridView, add HTML Controls Radio

To add an HTML control using a stencil column radio

 <asp:gridview id= "GridView2" runat= "Server" autogeneratecolumns= "False" Showheader= "False" > <Columns> <asp:TemplateField> <ItemTemplate> <input type= "Radio" name= " MyRadio "Value= ' <%# Container.DataItemIndex.ToString ()%> ' > </ItemTemplate> </asp:templatefield > </Columns> </asp:GridView> <asp:button id= "Button2" runat= "text=" Fetch option "onclick=" button2_ Click/> <asp:label id= "Label2" runat= "Server" ></asp:Label> 

<script type= "Text/javascript" >
function Setnowradio (v)
{
//alert (v);
var Myform,objradio;
Myform=document.forms[0];
for (Var i=0;i<myform.length;i++)
{
if (myform.elements[i].type== "Radio")
{
objradio= Myform.elements[i];
alert (objradio.name);
alert (objradio.value);
if (objradio.value==v)
{
objradio.checked=true
}}}} <asp:literal id= "jsliteral" runat= "Server" ></asp:Literal>
</script>

The preceding sentence <input type= "Radio" name= "MyRadio" value= ' <%# Container.DataItemIndex.ToString ' ()%> ' >, I am in his value, binding is the current line, because generally in the GridView operation, we often have to use the selected line number, with the line number, we can take the DataKeys of the GridView

Because the HTML control is used here, you use the Request.Form when fetching the data.

protected void button2_click (object sender, EventArgs e)
{
//Use template columns to add HTML controls Radio
if (request.form[" MyRadio "] = = null)
{
Label2.Text =" no item selected ";
Jsliteral.text = "";//*****
}
else
{
string value;
Value = request.form["MyRadio"]. ToString ();
Label2.Text = "Currently selected first" + Convert.ToString (convert.toint16 (value) + 1) + "a";
Jsliteral.text = "Setnowradio (' + value +" '); "; /*****
}
}

This method itself, is not to traverse the control can complete the task

is because the use of the client control, so the selected value can not be written into the viewstate inside, if there is a page return, this value can not be retained, if you want to be in the page after returning the value, you will use JS, look at the comments have * * * * That paragraph of code, I chose to set up a Setnowradio (), and then what about adding literal controls

In every time, well, because I only take the value to return, so I wrote in the value there, in fact, should be written in the Page_Load event, plus if (IsPostBack) of the judgment, is each return, it is necessary to take this myradio value, execute function, Re-select an item that is already selected

In this setnowradio, the traversal is used, which is that he is less than the first way to traverse the thing

The third way: directly using the RadioButtonList simulation table

Using RadioButtonList

<asp:radiobuttonlist id= "RadioButtonList1" runat= "Server" >
</asp:RadioButtonList>
<asp: Button id= "Button3" runat= "server" text= "Fetch Options" onclick= "Button3_Click"/> <asp:label "id= Label3" runat= "
Server ></asp:Label>

What I'm simulating here is something like a forum that shows the voting page, which is given a single marquee, followed by the option content, then a picture, and then shows a few votes

private void Setlistitem (RadioButtonList rbt)
{
//RadioButtonList plus several listitem to test the data
string item, Space , info;
int per;
for (int i = 0; i < 3; i++)
{per
= 5;
item = "<div style= ' Float:left;" width:300px; ' > First "+ convert.tostring (i + 1) +" Item </div> ";
Space = convert.tostring (per * 3.50);
Space = "<div style= ' Float:left;" Background-color:mistyrose;border-color:silver;border-width:1px;border-style:solid; Width: "+ space +" PX; ></div> ";
info = "<div style= ' Float:left"; width:70px; ' > "+ per. ToString () + "% 5 votes </div>";
Info = Item + space + info;
RADIOBUTTONLIST1.ITEMS.ADD (new ListItem (info, ""));
}

This method solves the problem of the radio, solves the problem of return, because RadioButtonList is to generate a group of radio control, that is, in the simulation of the time is very troublesome, I use a lot of div+css here, is, I still can't do it. Make the generated radio and options on the same line

The following is a line in the generated HTML code:

<tr>
<td>
<input id= "RADIOBUTTONLIST1_0" type= "Radio" "Name=" RadioButtonList1 "value=" "/>"
<label for= "Radiobuttonlist1_0" >
<div style= ' float:left; width:300px; ' > 1th </div>
<div style= ' float:left; background-color:mistyrose;border-color:silver;border-width : 1px;border-style:solid; width:17.5px; ' ></div>
<div style= ' float:left; width:70px; ' > 5% 5 votes </div>
</label>
</td>
</tr>

DIV is block-level elements, the use of float:left, also can not let them and radio on the same line, if you can control the width of the page, such as the determination of 788px, then we can use float:right; Text-align:left to control, is often not allowed to use PX to control the width of the page

Another way is to write code directly

protected void Rbtnsel_checkedchanged (object sender, EventArgs e)
{for
(int i = 0; I < this. GridView1.Rows.Count; i++)
{
(RadioButton) this. Gridview1.rows[i]. FindControl ("Rbtnsel")). Checked = false;
}
((RadioButton) sender). Checked = true;//Classic
}

More interested readers of asp.net related content can view the site topics: "asp.net operation JSON tips summary", "asp.net string operation tips Summary", "ASP.net Operation XML Skills summary", "asp.net file Operation skills Summary", " asp.net Ajax Skills Summary topic and the "ASP.net cache operation skills Summary."

I hope this article will help you to ASP.net program design.