如何使用 <asp:RadioButtonList> 验证文本框？

Question

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

1.我有两个带有 startdate 和 enddate 的文本框，如果它在单击单选按钮时为空白，它应该提醒“它不能为空白”

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 中。提前致谢

Answer 1

试试这个。我想这就是你要找的。​​p>

<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;
                }   
            }
        });
    }
  });

Jsfiddle