ラジオボタンがラジオボタンリストから選択されたときにJQueryを使用してリピーターにテキストボックスを表示

Question

私は、Webアプリケーションのアンケートに似た機能をいくつか構築しています。質問の一番下には、質問に答えるためのリンクがあります。ユーザーが質問に答えるためにリンクをクリックすると、リピーターが組み込まれたModal PopUpウィンドウが表示されます。リピーターは質問とラジオボタンリストを可能な限り回答として表示します。各回答に正当性がなければならないので、回答の横に正当なボックスがあります。ユーザが「下に」（値はB）という回答を選択した場合、ユーザが是正措置/予防措置を講じるためのテキストボックスが表示される必要があります。ユーザーが「Below」を選択した場合を除き、すべての修正ボックスが、重複したリピータ行ではなく、リピータ全体に表示されます。 「下」の回答の行にテキストボックスを表示するだけで、どのように達成できますか？

コード切れ端：

<script type="text/javascript"> 
$(document).ready(function() { 
    $("input:radio").change(function (eventObject) { 
     var type = $.trim($(this).val()); 
     if (type == "B") { 
      alert("Clicked"); //Testing... 
      $('.tblPreventative').show(); 
     } 
     else 
      $('.tblPreventative').hide(); 
    }); 

}); 

<asp:Repeater runat="server" ID="rptQuestions"> 
     <ItemTemplate> 
      <div class="AnswerSection"> 
       <div class="question"> 
       <asp:Label runat="server" ID="lblQuestId" Text='<%#Eval("guidQuestionId")%>' Visible="false" /> 
        <%#Eval("strQuestion")%> 
       </div> 
       <div class="answer"> 
       <table width="100%"> 
        <tr> 
         <td width="10%"> 
          <asp:RadioButtonList runat="server" ID="rbAnswer"> 
           <asp:ListItem Text="Meets" Value="M" /> 
           <asp:ListItem Text="Above" Value="A" /> 
           <asp:ListItem Text="Below" Value="B" /> 
           <asp:ListItem Text="N/A" Value="N" /> 
          </asp:RadioButtonList> 
          <asp:RequiredFieldValidator ID="rqfvRBAnswer" runat="server" ControlToValidate="rbAnswer" ErrorMessage="You must select an Assessment." ForeColor="Red" /> 
         </td> 
         <td valign="top" width="90%" style="padding-right:5px"> 
          <strong>Justification</strong> 
          <br /> 
          <asp:TextBox ID="txtJustification" runat="server" TextMode="MultiLine" Width="100%" Height="70px" /> 
          <asp:RequiredFieldValidator ID="rqfvJustification" runat="server" ControlToValidate="txtJustification" ErrorMessage="Please input a justification." ForeColor="Red" /> 
         </td> 
        </tr> 
        <tbody class="tblPreventative" style="display:none;"> 
        <tr> 
         <td width="10%"> 
         </td> 
         <td valign="top" width="90%" style="padding-right:5px"> 
         <strong>Corrective Action</strong> 
          <br /> 
          <asp:TextBox ID="txtPreventative" runat="server" TextMode="MultiLine" Width="100%" Height="70px"/> 
         </td> 
        </tr> 
        </tbody> 
       </table> 

       </div> 
      </div> 
      <br /> 
     </ItemTemplate> 
    </asp:Repeater> 

Answer 1

は、このスクリプトを試してみてください。

$(document).ready(function() { 
    $("input:radio").change(function (eventObject) { 
      var type = $.trim($(this).val()); 
      if (type == "B") { 
       alert("Clicked"); //Testing... 
       $(this).closest("tr").next("tbody").show(); 
      } 
      else 
       $(this).closest("tr").next("tbody").hide(); 
    }); 

});