2009-04-21 12 views
5

ProblemjQuery UI Dialog + ASP.NET area per + Fokus

ich jQuery UI Dialog bin mit einem Dialogfeld mit einigen ASP.NET Textfelder zu zeigen und einen Knopf drin. Da jQuery das div für das Dialogfeld jedoch außerhalb des Formulars verschiebt, muss ich es selbst zurück in das Formular verschieben (siehe this für Details warum), so dass ASP.NET immer noch funktioniert. Diese Verschiebung verursacht ein Problem, bei dem das Feld nicht aktiviert wird, wenn es aufgerufen wird.

Wenn Sie sich das Beispiel ansehen, sollte die Zeile mit der Bezeichnung Linie B den Fokus setzen, jedoch bricht die Linie mit der Linie A dies ab. Wenn ich Zeile A kommentiere, funktioniert es. Egal, wohin ich Zeile B (vor Dialog, Zeile A usw.) verschiebe, kann der Fokus immer noch nicht gesetzt werden.

Durch die Einstellung Fokus ich meine der Cursor ist im Textfeld blinkend bereit zu tippen.

Q Wie stelle ich den Fokus in diesem Szenario ein?

Proben

HTML Körperprobe

<body> 
<form id="form1" runat="server"> 
<div id="popup"> 
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br /> 
    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> 
</div> 
</form> 
</body> 

jQuery Probe

 $(document).ready(function() { 
     var dlg = $("#popup").dialog(); 
     /*Line A*/ dlg.parent().appendTo(jQuery("form:first")); 
     /*Line B*/ $("#TextBox2").focus(); 
    }); 
+0

Siehe meine Lösung zu verhindern, dass Fokus in jQuery UI Dialogfeld [http://stackoverflow.com/a/9428501/1230428] (http://Stackoverflow.com/a/9428501/1230428) Viel Glück – Roc

Antwort

3

Es in FF funktioniert aber nicht in IE7. Ich habe 2 Work arounds herausgefunden. Wenn Sie das Textfeld nicht nach Name, sondern nach Position oder aus irgendeinem Grund referenzieren, wenn Sie den Fokus zweimal festlegen.

Die erste:

$("input:text:second").focus(); 

Die zweite:

$("#TextBox2").focus().focus(); 
1

Sie könnten auch Klasse das Textfeld, wie asp.net Kontrolle ids Namenskonflikte zu vermeiden verstümmelt.

$(".mytextbox").focus(); 

als Beispiel .. dies natürlich den Zweck der Semantik aber Semantik nicht mit Webforms gut mischte.

4

Ich denke, das Problem ist, dass Sie das Popup verschieben und Fokus aufrufen, bevor der Dialog vollständig erstellt wird.

Versuchen Sie, die stattdessen open Veranstaltung Dialog:

$(document).ready(function() { 
    $("#popup").dialog({ 
    open: function(){ 
     $(this).parent().appendTo(jQuery("form:first")); 
     $("#TextBox2").focus(); 
    } 
    }); 
}); 
+0

Dies funktioniert für ich in Ubunutu Firefox 10.0.2 & IE 6 so weit. Vielen Dank. –

7

Versuchen setTimeout("$('#TextBox2').focus();",100);, für Dialog und andere Methoden der jQuery UI es manchmal einige Sekunden dauern, um tatsächlich die Aufgaben wir von Code zuweisen.

Hoffe, das hilft. Diese Problemumgehung hat in vielen meiner Anwendungen geholfen.

+1

Arbeitete, musste aber mein Timeout auf 500 erhöhen. Thx – theschmitzer