jQuery妨害wth IF文を切り替えます

Question

私はステップ予約プロセスで1ページステップをコーディングしています。
ボタンをクリックすると、コンテンツが切り替わるようにコード化しました。

これは、IF文が機能しないように、これはボタンクリックイベントの1つの背後にある私のVB.NET IF文と干渉したようです。
何かが選択されていない場合は、divが表示されます。

私は何をすればいいですか？

HTML：

<section> 

    <div class="ChooseDoctor">  
    <div class="col-md-50 col-sm-50" style="text-align:center;"> 
     <h2>Choose your doctor</h2> 

     <div class="alert alert-warning" id="warninginfo" runat="server"> 
     <strong>Warning!</strong> You have not selected your chosen doctor! 
     </div> 

     <br /> 

     <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:myConnectionString %>" SelectCommand="SELECT [FirstName], [Surname], [DoctorNumber], [ContactNumber] FROM [DoctorDetails]"> 
     </asp:SqlDataSource> 
     <div class="col-md-50 col-sm-50" style="text-align:center;"> 
     <asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" CellPadding="2" DataSourceID="SqlDataSource1" ForeColor="#333333" GridLines="None" DataKeyNames="DoctorNumber" Height="411px" Width="824px" ShowHeader="False" HorizontalAlign="Center"> 
      <AlternatingRowStyle BackColor="White" ForeColor="#284775" /> 
      <Columns> 
      <asp:BoundField DataField="DoctorNumber" HeaderText="DoctorNumber" InsertVisible="False" ReadOnly="True" SortExpression="DoctorNumber" /> 
      <asp:BoundField DataField="FirstName" HeaderText="First Name" SortExpression="Forename" /> 
      <asp:BoundField DataField="Surname" HeaderText="Surname" SortExpression="Surname" /> 
      <asp:CommandField ButtonType="Image" ShowSelectButton="True" SelectImageUrl="~/Images/buttonforbooking.png" /> 
      </Columns>   
     </asp:GridView> 

     <br /> 

     <asp:Button ID="btnNextDate" runat="server" Text="Next Step" OnClientClick="return false;" BackColor="#02bdd5" ForeColor="#ffffff" CssClass="btn btn-default btn-send" Height="55px" Width="211px" Align="Center"/> 
     <br /> 
     </div> 
    </div> 
    </div> 

コードビハインドファイル：

warninginfo.Visible = False 

btnNextDate_Click(sender As Object, e As EventArgs) Handles btnNextDate.Click 
If GridView1.SelectedValue = Nothing Then 
    warninginfo.Visible = True 
End If 

JSファイル：

$(document).ready(function() 
{ 

    $("[id$=btnNextDate]").click(function() { 
     $("[id$=ChooseDate]").slideToggle('slow'); 
    }); 

Answer 1

あなたは、このようにコードを変更する必要があります。

$(document).ready(function() 
{  
    $('#' + '<%= btnNextDate.ClientID %>').click(function (e) { 
     e.preventDefault(); 
     $('#' + '<%= ChooseDate.ClientID %>').slideToggle('slow'); 
    }); 
}); 

を

サーバIDの代わりにクライアントIDを使用する。ちょうど今私はこれを試して正常に動作しました。

Answer 2

個人的には、クリックされたボタンに関連して必要な要素が見つかるでしょう。兄弟ノードの場合、これはかなり簡単です。 DOMトラバーサルは、DOM全体の中のノードを見つけることと比べて驚くほど効率的です。

idsでなくクラスも使用しますが、これはやや面倒です。

まず：

• ボタンのクラスリスト
• にnextDateを追加ChooseDate divのクラスのリストにchooseDateを追加します。次のよう

今すぐクリックハンドラを記述します。

$(document).ready(function() { 
    $("button.nextDate").on('click', function(e) { 
     e.preventDefault(); // Maybe required, maybe not? 
     $(this).siblings(".chooseDate").slideToggle('slow'); // Find the required element relative to the clicked button. DOM traversal is very efficient. 
    }); 
}); 

IDは他の理由のために必要とされる場合を除き、彼らは消えることができます。

これはVB.NET IFステートメントの妨げになるかどうかは分かりませんが、e.preventDefault();ステートメントの有無にかかわらず試してみる価値があります。