jQuery beziehen sich auf Steuerelement ID in Vorlage Feld

Question

Ich möchte auf die ID eines Steuerelements in meinem Javascript verweisen. Das Steuerelement befindet sich im Feld "Vorlage". Hier

ist das, was ich getan habe:

<ItemTemplate> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
       $('#ReqDate2.ClientID').dynDateTime({ 
         showsTime: true, 
         ifFormat: "%d/%m/%Y %H:%M", 
         daFormat: "%l;%M %p, %e %m, %Y", 
         align: "BR", 
         dlectric: false, 
         singleClick: false, 
         displayArea: ".siblings('.dtcDisplayArea')", 
         button: ".next()" 
        }); 
      }); 
</script>      
<asp:TextBox ID="ReqDate2" runat="server" ReadOnly="true" Style="width: 128px"></asp:TextBox> 
    <img src="../Images/calender.png" /> 
</ItemTemplate> 

Dieser Code soll den Kalender machen Javascript Pop-up, wenn ich auf dem Kalander Bild klicken, aber es geschieht nicht.

Ich denke, es ist, weil ich nicht die ID der Textbox Auswahl bin richtig: $ (‚# ReqDate2.ClientID‘)

Wie soll ich es stattdessen wählen?

Answer 1

Try this:

$('#ReqDate2').dynDateTime({ 
    showsTime: true, 
    ifFormat: "%d/%m/%Y %H:%M", 
    daFormat: "%l;%M %p, %e %m, %Y", 
    align: "BR", 
    electric: false, 
    singleClick: false, 
    displayArea: ".siblings('.dtcDisplayArea')", 
    button: ".next()" 
}); 

, wenn Sie eine eindeutige ID haben gibt es keine Notwendigkeit, alle anderen Wähler mit, dass hinzuzufügen.

Answer 2

Statt textbox id seine class name

Versuchen Sie, diese verwenden Zugriff auf: Seine Arbeit für mich in Ordnung.

$(document).ready(function() { 
    $(".Calender").dynDateTime({ 
     showsTime: true, 
     ifFormat: "%Y/%m/%d %H:%M", 
     daFormat: "%l;%M %p, %e %m, %Y", 
     align: "BR", 
     electric: false, 
     singleClick: false, 
     displayArea: ".siblings('.dtcDisplayArea')", 
     button: ".next()" 
    }); 
}); 

Sie sollten das ItemTemplate auch ändern.

<ItemTemplate> 
    <asp:TextBox ID="txtDOB" runat="server" ReadOnly="true" CssClass = "Calender" /> 
    <img src="calender.png" /> 
</ItemTemplate> 

Answer 3

Wenn ASP.net die Änderungen macht so die ID, wenn Sie den HTML-Code der Ausgabe sehen es wahrscheinlich nicht sein ReqDate2

die JavaScript, um die korrekte ID Referenz zu machen, verwenden

$('#<%= ReqDate2.ClientID %>').dynDateTime({ 

Da dies ein itemTemplate ich gegen die Verwendung dieses Ansatzes raten würde und einen Class-Ansatz von Lakshmi prakasan

Answer 4

Klassen zu verwenden verwenden hat super funktioniert, aber da ich auch eine Validierung habe, funktioniert es jetzt nicht. Ich nehme die Validierung heraus und es funktioniert gut. Die untere Validierung ist kommentiert.

<asp:TemplateField HeaderText="Drop Off - Date &amp; Time"> 
        <EditItemTemplate> 
         <asp:TextBox ID="dropoffdateandtime" runat="server" class = "Calender" 
          Text="<%# Bind('dropoffdateandtime') %>" /> 
         **<%--<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="dropoffdateandtime" ErrorMessage="date &amp; time is required" ForeColor="#999999"></asp:RequiredFieldValidator>--%>** 
        </EditItemTemplate> 
        <HeaderStyle Wrap="False" /> 
        <ItemStyle Wrap="False" /> 
       </asp:TemplateField> 

mit Javascript

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".Calender").dynDateTime({ 
      showsTime: true, 
      ifFormat: "%Y/%m/%d %H:%M", 
      daFormat: "%l;%M %p, %e %m, %Y", 
      align: "BR", 
      electric: false, 
      singleClick: false, 
      displayArea: ".siblings('.dtcDisplayArea')", 
      button: ".next()" 
     }); 
    }); 
</script>