2009-04-21 3 views
5

проблемаJQuery UI Dialog + ASP.NET Textboxes + фокус

Я использую JQuery UI диалоговое окно, чтобы показать диалоговое окно с некоторыми текстовыми полями ASP.NET и кнопки в нем. Однако, поскольку jQuery перемещает div для диалогового окна вне формы, мне нужно снова переместить его обратно в форму (см. this для получения дополнительной информации, почему), так что ASP.NET все еще работает. Это перемещение вызывает проблему, когда поле не получает фокус при вызове.

Если вы посмотрите на образец ниже, строка, обозначенная как «Линия B», должна установить фокус, однако линия, помеченная линией A, нарушает это. Если я прокомментирую строку A, это сработает. Независимо от того, где я перемещаю строку B (до диалога, строки A и т. Д.), Он все еще не может установить фокус.

Установив фокус, я имею в виду, что курсор находится в текстовом поле, которое мигает, готовое к типу.

Q uestion Как установить фокус в этом сценарии?

Образцы

образец HTML тело

<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 образец

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

Посмотрите мое решение, чтобы предотвратить фокусировку на jQuery UI Dialog [http://stackoverflow.com/a/9428501/1230428](http://stackoverflow.com/a/9428501/1230428) Удачи – Roc

ответ

3

Он работает в FF, но не в IE7. Я выяснил 2 работы вокруг. Если вы не ссылаетесь на текстовое поле по имени, а по положению или по какой-либо причине, если дважды установить фокус.

Первое:

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

Второе:

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

вы можете также класс текстовое поле, в asp.net искалечил управления идентификаторами, чтобы избежать конфликтов имен.

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

как пример .. это, конечно, побеждает цель семантики, но семантика DonT хорошо перемешать с WebForms.

4

Я думаю, проблема в том, что вы перемещаете всплывающее окно и вызываете фокус до того, как диалог будет полностью создан.

Попробуйте использовать open события в диалоговом окне вместо:

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

Это работает для меня в Ubunutu Firefox 10.0.2 и IE 6 до сих пор. Благодарю. –

7

Попробуйте использовать setTimeout("$('#TextBox2').focus();",100); для диалога и других методов JQuery UI иногда требуется несколько секунд, чтобы фактически выполнять задачи, которые мы присваиваем код.

Надеюсь, это поможет. Это обходное решение помогло во многих моих приложениях.

+1

Работал, но мне приходилось поднимать мой тайм-аут до 500. Thx – theschmitzer