如何使用<asp:RadioButtonList>

How to validate textbox with <asp:RadioButtonList>?

本文关键字:RadioButtonList asp gt 何使用 lt      更新时间:2023-09-26

我想让单选按钮列表验证8个文本框,在选择单选按钮时我想做两件事。

1.我有两个文本框,其中包含开始日期和结束日期。如果单击单选按钮时为空,则应提醒"不能为空">

2.我有另外两个与上面相同的文本,这里它必须验证上面的文本框,如果它是空白的,它也应该提醒它。其他4个文本框也是如此

Radiobutton list
    <asp:RadioButtonList ID="rbtLstRating" runat="server" OnClick="return  checked()"
            RepeatDirection="Vertical" RepeatLayout="Table" Height="255px" Width="95px"  >
            <asp:ListItem Text="one" Value="one"></asp:ListItem>
            <asp:ListItem Text="two" Value="two"></asp:ListItem>
            <asp:ListItem Text="three" Value="three"></asp:ListItem>
            <asp:ListItem Text="four" Value="four"></asp:ListItem>
               </asp:RadioButtonList>            

这就是我在javascript中尝试的前两个文本框,但它不起作用。

 function checked() {
        var radio = document.getElementById("rbtLstRating")
        var cal1 = document.getElementById('<%=textstqo.ClientId%>').value;
        var cal2 = document.getElementById('<%=textedqo.ClientId%>').value;
         if (radio.checked) {
                if (cal1 == '' && cal2 == '') {
                    alert("it cannot be blank");
                    return false
                }
                else {
                    alert("it has been enabled");
                    return true;
                }
            }
        }

文本框

          <td >
            <asp:Label ID="Labstart" runat="server" Text="Start Date"></asp:Label>
            </td>
            <td>
            <asp:TextBox ID="textstqo"  runat="server" ></asp:TextBox>
             <td >
            <asp:Label ID="Label3" runat="server" Text="End Date"></asp:Label>
            </td>
            <td>
            <asp:TextBox ID="textedqo"  runat="server"  ></asp:TextBox>
             </tr>
        </table>
        </div>
        <div style="margin-top:30px">  
         <table>
            <tr>
            <td >
            <asp:Label ID="Label4" runat="server" Text="Start Date"></asp:Label>
            </td>
            <td>
            <asp:TextBox ID="txtstartdateqt"  runat="server" ></asp:TextBox>
              </td>
            <td >
            <asp:Label ID="Label5" runat="server" Text="EndDate"></asp:Label>
            </td>
            <td>
            <asp:TextBox ID="txtenddateqt"  runat="server" ></asp:TextBox>
                </tr>
                </table>
                </div>
                <div style="margin-top:30px">  
            <table>
            <tr>
            <td >
            <asp:Label ID="Label7" runat="server" Text="Start Date"></asp:Label>
            </td>
            <td>
            <asp:TextBox ID="txtstardateqre"  runat="server" ></asp:TextBox>
        </td>
         <td >
            <asp:Label ID="Label8" runat="server" Text="EndDate"></asp:Label>
            </td>
            <td>
            <asp:TextBox ID="txtenddateqre"  runat="server" ></asp:TextBox>
           </td>
           </tr>
            </table>
             </div>
             <div style="margin-top:30px">  
            <table>
            <tr>
            <td >
            <asp:Label ID="Label10" runat="server" Text="Start Date"></asp:Label>
            </td>
            <td>
            <asp:TextBox ID="txtstartdateqf" class="MyTestClass" runat="server" ></asp:TextBox>
                                 </td>
            <td >
            <asp:Label ID="Label11" runat="server" Text="End Date"></asp:Label>
            </td>

            <td>
            <asp:TextBox ID="textenddatef" class="MyTestClass" runat="server" ></asp:TextBox>

您可以在javascript或vb.net中提供帮助吗?提前感谢

试试这个。我想这就是你想要的。

<input type="radio" name = "box" id ="box1">
<input type="radio" name = "box" id ="box2">
<input type="text" name = "text" id ="text1">
<input type="text" name = "text" id ="text2">
<input type="text" name = "text" id ="text3">
<input type="text" name = "text" id ="text4">
$('input[type="radio"]').click(function(){
    var _this = $(this).attr("id");
    var count = 0;
    if ($(this).is(':checked'))
    {
        $('input[type="text"]').each(function(){
            count++;
            if(_this === "box1" && count <=2) {
                if($(this).val() === "") {
                    alert("it cannot be blank");
                    return false;
                }
            } else if (_this === "box2" && count <=4) {
                if($(this).val() === "") {
                    alert("it cannot be blank");
                    return false;
                }   
            }
        });
    }
  });

Jsfddle