asked on

Attributes for Radio Button List in datagrid

I have a datagrid that is listing donation options. Each donation option has a few recommended amounts. The recommended amounts is stored in the database as a comma seperated list. The list is then split and the resulting array is used to bind to the radio button list. Also in each row of the datagrid is a textbox. This is to allow values other than the recommended amounts. What I want to happen is.....when someone selects a radio button the value is placed into the text box. Also, when you focus on the textbox, the radio button should be deselected. I also want this to happen without posting back.

This was fairly easy in ASP classic.....not sure how to get it to go in .NET.

What is the easiest way to accomplish this?

Thanks for your help.

Daniel

shovavnik

What you need to do is create a couple of generic javacript functions on the client-side, exactly the same way you would if you were working with classic ASP.

You'll need a function for selecting a radio button, which will update the associated textbox, and another function for the onfocus event of the textbox to deselect the radio button. If you need help with the javascript, let us know.

The hard part is associating a set of radio buttons with a textbox. One way that I've found convenient, is to add a "fake" attribute to my radio buttons and the textbox that gives me quick access to the associated controls on the client-side. For example:
<asp:RadioButton id="myradios1" base="1" Text="hello" value="1" selected="true"></asp:RadioButton>
<asp:RadioButton id="myradios1" base="1" Text="hello again" value="2"></asp:RadioButton>
<asp:RadioButton id="myradios1" base="1" Text="and again" value="3"></asp:RadioButton>
<asp:TextBox id="textbox1" base="1" Text="hello"></asp:TextBox>

On the client-side, you'd response to the events:
<script for="textbox1" event="onfocus">
var obj = event.srcElement;
var base = obj.base;
var radios = document.getElementsByName( 'myradios' + base );
for( index = 0; index < radios.length; index++ ) {
radios[ index ].checked = false;
}
</script>

That's the general idea.

dbashley1

ASKER

shovanik,

That is an interesting solution....

I need a little more info.....because the number of donation options is not fixed, how do I create a script that handles all the possible text boxes? I have attaced the code below.

<asp:DataGrid HorizontalAlign="Center" ShowHeader=False Width="660px" id="dgrCategoryOptions" AutoGenerateColumns=False DataSource='<%# getOptions(databinder.eval(container.dataItem, "idDonationCategory"))%>' Runat=server>
                                                                                    <Columns>
                                                                                          <asp:TemplateColumn>
                                                                                                <ItemTemplate>
                                                                                                      <table style="text-indent:15pt;" align="center" width="660px">
                                                                                                            <tr>
                                                                                                                  <td align="left">
                                                                                                                        <asp:RadioButtonList RepeatDirection=Horizontal DataSource='<%# getOptionIncrements(container.dataItem("DonationIncrements"))%>' Runat=server>
                                                                                                                        </asp:RadioButtonList></td>
                                                                                                                  <td align="right">
                                                                                                                        Amount: 
                                                                                                                        <asp:TextBox ID="txtAmount" Runat="server"></asp:TextBox>
                                                                                                                  </td>
                                                                                                            </tr>
                                                                                                            <tr style="text-indent:15pt;">
                                                                                                                  <td><%# container.dataItem("DonationDescription") %></td>
                                                                                                            </tr>
                                                                                                      </table>
                                                                                                </ItemTemplate>
                                                                                          </asp:TemplateColumn>
                                                                                    </Columns>
                                                                              </asp:DataGrid>

Thanks

ASKER CERTIFIED SOLUTION

shovavnik

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial