2016-07-14 9 views
3

Ich bin nicht herausfinden können, wie diese Wähler richtig txtUsername Element ist die Auswahl:jQuery ID-Selektor für verschachtelte Elemente in asp.net?

aspx:

<asp:Content ID="Content1" ContentPlaceHolderID="body" runat="Server"> 
    ... 
    <div class="copy" style="float: left; width: 210px"> 
     <span class="copy" style="float: left; width: 210px"> 
      <asp:TextBox ID="txtUserName" runat="server" CssClass="ffield copy" Style="width: 198px;"></asp:TextBox> 
     </span> 
    </div> 

jQuery:

var username = $('#body_txtUserName').val(); 

Die ID für die asp: TextBox ist txtusername nicht body_txtUserName, die einzige Sache, die ich denken kann, ist, dass die txtusername in einem asp:Content Element mit ContentPlaceHolderID="body"

verschachtelt ist

Wenn das stimmt, was ist die Bedeutung des Unterstrichs? Ich kann keine Dokumentation zu dieser Syntax für jQuery-Selektoren finden

+1

Haben Sie die aktuelle HTML-Ausgabe geprüft, die Webforms Gegensatz sehen? ASP.Net Webforms ist bekannt für die Änderung der 'ID' Eigenschaft von' runat = "server" 'Elementen zur Laufzeit. –

+0

Ja, es ist .. die Client-ID und die tatsächliche ID können abweichen. body_txtUserName ist in Ihrem Fall die Client-ID. –

+0

Verwenden Sie Klassenname für Ihre Eingaben, es ist statisch und einfacher zu arbeiten! – CMedina

Antwort

2

ASP.NET ändert IDs zur Laufzeit, und es ist am besten, sie nicht zu erraten. Stattdessen sollten Sie entweder die ID korrigieren, die generierte verwenden oder schlau sein, was Sie auf der Clientseite auswählen. Ihre Optionen:

  1. Wenn Ihr Skript auf der aspx Seite selbst ist, sollten Sie in der Lage sein ClientID zu verwenden wie so:

    $('#<%=txtUserName.ClientID %>') 
    
  2. Wenn Sie absolut sicher sind, diese Steuerung ist die einzige mit diese ID auf der Seite, fixieren Sie die ID mit dieser Steuerung Eigenschaft:

    ClientIDMode="Static" 
    
    $('#txtUserName') 
    
  3. Sie sollten wahrscheinlich nicht auf diese angewiesen sein, sondern erzeugt IDs in der Regel am Ende mit dem, was ID Sie verwenden d auf der Serverseite.So können Sie versuchen, verwenden „endet mit“ jQuery-Selektor:

    $('input[id$="txtUserName"]') 
    

Auch dies nicht eine sehr gute Idee ist, da sie auf Annahmen darüber, wie ID Generation Werke beruht.

  1. Weisen Sie eine andere CSS-Klasse zu und verwenden Sie diese. Sie brauchen nicht diese Klasse in Ihrem Stylesheets zu definieren, ist es OK, diese Technik bei der Auswahl nur zu verwenden:

    CssClass="ffield copy userNameText" 
    
    $(".userNameText") 
    
1

Es ist nicht mit jQuery verbunden. Dies liegt daran, dass der Client Id und der tatsächliche Id abweichen können. body_txtUserName ist Client Id in Ihrem Fall. Versuchen Sie:

$('#<%= txtusername.ClientID %>'); 
+0

Beachten Sie, dass dies nur funktioniert, wenn sich der Code in einer ASPX-Datei befindet (was eigentlich nicht sein sollte). Wenn es sich um eine .js-Datei handelt, wird das ASP-Tag so gerendert, wie es ist. –

+0

@ rory-mccrossan Danke für das Add-on :) –

0

Es gibt ein paar Optionen hier abhängig davon, wo Ihr tatsächliches Javascript befindet.

Javascript innerhalb einer ASPX-Datei

Das ist einfach, wie Sie die ClientID Eigenschaft verwenden, können Sie die entsprechende Client-seitige ID für die Steuerung zu beheben:

// This will resolve the client-side ID as expected 
$('#<%= txtUserName.ClientID %>'); 

Dies wird nicht funktionieren wenn Ihr jQuery-Code jedoch in einer externen Javascript-Datei enthalten ist.

Javascript in einer externen Datei

Wenn Javascript in einer externen Datei enthalten ist, könnte man bedenkt, die mit the jQuery "ends-with" selector$=, die ein Element entsprechen würde, die mit der entsprechenden ID beendet:

$('[id$="txtUserName"]') 
Verwandte Themen