Выбор содержимого ASP.NET TextBox в UpdatePanel после частичной обратной передачи страницы

Question

У меня проблемы с выделением текста в TextBox в UpdatePanel в IE 8. Рассмотрим очень простую страницу, которая содержит одну UpdatePanel. В этой UpdatePanel есть два веб-элемента управления:

1. DropDownList с тремя статически определенными элементами списка, для свойства AutoPostBack которых установлено значение True, и
2. Элемент управления TextBox Web

DropDownList имеет обработчик событий на стороне сервера для своего события SelectedIndexChanged, и в этом обработчике событий есть две строки кода:

TextBox1.Text = "Whatever";
ScriptManager.RegisterStartupScript(this, 
                      this.GetType(), 
                      "Select-" + TextBox1.ClientID,
                      string.Format("document.getElementById('{0}').select();", 
                                                       TextBox1.ClientID), 
                      true);

Идея состоит в том, что всякий раз, когда пользователь выбирает элемент из списка DropDownList, происходит частичная обратная передача страницы, после чего свойство TextBox устанавливается и выбирается (с помощью встроенного JavaScript). К сожалению, это не работает как есть. (Я также безуспешно пытался поместить скрипт в функцию pageLoad, например: ScriptManager.RegisterStartupScript (..., "function pageLoad () {... мой скрипт ... } "); ) Что происходит, когда код выполняется, но что-то еще на странице получает фокус при завершении частичной обратной передачи страницы, в результате чего текст TextBox не выбирается.

Я могу «исправить» это с помощью JavaScript setTimeout, чтобы задержать выполнение моего кода JavaScript. Например, если я обновлю испущенный JavaScript до следующего:

setTimeout("document.getElementById('{0}').select();", 111);

Это "работает". Я помещаю работы в кавычки, потому что это работает для этой простой страницы на моем компьютере. На более сложной странице на более медленном компьютере с большей разметкой, передаваемой между клиентом и сервером при частичной обратной передаче страницы, мне нужно увеличить время ожидания более чем на секунду, чтобы заставить его работать. Я надеюсь, что есть более надежный способ добиться этого. Вместо того, чтобы говорить «Задержка на X миллисекунд», было бы идеально сказать: «Запустите это, когда вы не собираетесь красть фокус».

Что удивляет, так это то, что метод .Focus () работает прекрасно. То есть, если я удаляю свой JavaScript и заменяю его вызовом TextBox1.Focus (); , тогда TextBox получает фокус (хотя текст не выделен). Я изучил содержимое MicrosoftAjaxWebForms.js и вижу, что фокус установлен после запуска зарегистрированных сценариев, но я не обладаю достаточными навыками JavaScript, чтобы декодировать все, что здесь происходит, и почему выделенный текст не выбран между временем, когда он выделен, и концом частичной обратной передачи страницы. Я также пытался использовать JavaScript-отладчик Firebug и вижу, что при запуске моего скрипта текст TextBox выбран. По мере того, как я продолжаю проходить по нему, текст остается выделенным, но затем после удаления последней строки сценария (по-видимому) он внезапно становится невыбранным.

Есть идеи? Я вытаскиваю свои волосы.

Заранее спасибо ...

РЕДАКТИРОВАТЬ: После дальнейшего тестирования я заметил, что это происходит только в IE 8. Это происходит не при тестировании в Firefox, Chrome или Safari ...

Answer 1

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
        function(sender, args) {
            document.getElementById('TextBox1.ClientID').focus();
        });

Это будет вызвано, когда UpdatePanel завершит свой запрос. Вам также необходимо повторно извлечь элемент из DOM, поскольку любые ссылки на него до вызова панели обновления не будут указывать на поле после завершения работы панели обновления.

Answer 2

Я не очень часто использовал UpdatePanel, поэтому не знаю, насколько это полезно для ваших конкретных обстоятельств, но у меня были проблемы с фокусировкой при использовании оболочки jQuery document.ready. Если вы уже не используете jQuery, возможно, стоит попробовать - попробуйте изменить RegisterStartupScript для вывода что-то вроде:

$(document).ready(function() {
    document.getElementById('TextBox1.ClientID').select();
});

Конечно, могут быть не jQuery способы сортировки, но этот метод обычно делает его простым.