Radiobutton text alignment error

I work in asp.net and have a list of radio objects, and I want to align their text as needed. Here is what I have at the moment:

enter image description here

I want to make them like this:

enter image description here

EDIT: Secondly, when I click Ages From radiobutton, I display a div against this, for example:

enter image description here

and when I click on the button "All ages", I want to hide this div. But SelectedIndexChanged does not work a second time onwards. It only works for the first time.

Aspx code:

<table>
                        <tr>
                            <td>
                                <asp:RadioButtonList ID="rdoAge" runat="server" RepeatDirection="Horizontal" 
                                    onselectedindexchanged="rdoAge_SelectedIndexChanged" AutoPostBack="true" >
                                    <asp:ListItem Text="All Ages" Value="All Ages" Selected="True"></asp:ListItem>
                                    <asp:ListItem Text="Ages From" Value="Ages From"></asp:ListItem>
                                </asp:RadioButtonList>
                            </td>
                            <div id="divAge" runat="server" visible="false">
                                <td>
                                    <asp:TextBox ID="txtAgeFrom" runat="server" CssClass="textEntry2" MaxLength="3" Width="65"></asp:TextBox>
                                </td>
                                <td>
                                    <asp:Label ID="lblTo" runat="server" Text="To"></asp:Label>
                                </td>
                                <td>
                                    <asp:TextBox ID="txtAgeTo" runat="server" CssClass="textEntry2" MaxLength="3" Width="65"></asp:TextBox>
                                </td>
                            </div>
                        </tr>
                    </table>

Cs file code:

protected void rdoAge_SelectedIndexChanged(object sender, EventArgs e)
    {
        switch (rdoAge.SelectedValue)
        {
            case "All Ages":
                divAge.Visible = false;
                break;
            case "Ages From":
                divAge.Visible = true;
                break;
        }
    }

I would be grateful if anyone would suggest something useful for this problem.

Thanks in advance.

+3
source share
3 answers

. , , . , . .

.

+1

css sytel

<style type="text/css">
 table.radioWithProperWrap input
 {    
      float: left;
 }

 table.radioWithProperWrap label
 {    
      word-wrap: break-word;

 }
</style>
<asp:RadioButtonList runat="server" CssClass="radioWithProperWrap" ....>
0
 switch (rdoAge.SelectedItem.Text)

In the source code, define the update panel as follows:

 <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

and then in the OnSelectedIndexChanged event add UpdatePanel1.Update ();

0
source

All Articles