如何使用驗證文本框 <asp:RadioButtonList> ？

Question

我希望單選按鈕列表可以驗證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中。

Answer 1

嘗試這個。 我認為這是您想要的。

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

傑斯菲德爾