Устанавливаем фокус на ASP.NET Web Server Controls
В ASP.NET можно установить фокус для следующих контролов:
- Button, LinkButton и ImageButton
- CheckBox
- DropDownList
- FileUpload
- HyperLink
- ListBox
- RadioButton
- TextBox
- Login (фокус будет установлен на первый контрол внутри Login)
Самым простым способом будет вызвать серверный код (например, для нужного TextBox):
if (!IsPostBack) {
tbFirstName.Focus();
}
Второй, не более сложный способ - вызвать статический метод SetFocus объекта страницы Page, передав ему ссылку на необходимый контрол или клиентский идентификатор контрола:
if (!IsPostBack) {
Page.SetFocus(tbFirstName);
Page.SetFocus(tbFirstName.ClientID);
}
Клиентский идентификатор необходим потому, что операция установки фокуса происходит на стороне клиента, а не сервера.
В связи с этим можно динамически создать и выполнить JavaScript для установки фокуса:
ScriptManager.RegisterStartupScript(Page, typeof(Page), "SetFocus",
string.Format(@"
var txtBox = document.getElementById('{0}');
if (txtBox!=null) txtBox.focus();", tbFirstName.ClientID), true);
Как установить фокус на контрол, который находится внутри модального окна (ModalPopup из Ajax Control Toolkit) обсуждается здесь.
Кроме того, можно установить свойство DefaultFocus для конкретной формы:
<%@ Page Language="C#" %><br /><html><br /><head runat="server"><br /> <title>Test Page</title><br /></head><br /><body><br /> <form id="form1" runat="server" <b>defaultfocus="TextBox1"</b> ><br /> <div><br /> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br /> <br /><br /> <asp:Button ID="Button1" runat="server" Text="Button" /><br /> <br /><br /> </div><br /> </form><br /></body><br /></html><br /><br />Там же написано, что можно это свойство использовать для Panel:<br /><br /><i> Set the DefaultFocus attribute of the form element in the page <b>or of a Panel control. </b></i><br /><br />
Хотя если проверить, то такого свойства в Panel нет (!), зато есть свойство DefaultButton, которое определяет какую кнопку использовать по умолчанию, когда пользователь нажал не кнопку, а Enter.
Если вы используете валидаторы (RequiredValidator, CompareValidator и т.д.), то можете использовать свойство SetFocusOnError для установки фокуса при ошибке.
Еще можно почитать обо всех этих свойствах в блоге Скотта Гутри.
TextBoxWatermarkExtender
Но если вы используете TextBoxWatermarkExtender (из Ajax Control Toolkit), то ни один из вышеперечисленных способов работать не будет. Extender просто "перетирает" ваш код своей внутренней логикой.
Когда я начал исследовать свойства TextBoxWatermarkExtender, то нашел много интересного: например свойства ClientState и EnableClientState.
Посмотрев на код TextboxWatermarkExtender.cs
// If this textbox has default focus, use ClientState to let it know
ClientState = (string.Compare(Page.Form.DefaultFocus, TargetControlID, StringComparison.InvariantCultureIgnoreCase) == 0) ? "Focused" : null;
стало понятно, что необходимо "дать знать" екстендеру о том, что контрол необходимо сфокусировать. EnableClientState по умолчанию установлен в true, поэтому его трогать не нужно.
Далее я нашел еще один интересный метод Focus(), который, как я уже обрадовался, решит все мои проблемы, но, к сожалению, он этого не сделал. И вообще понять, в каких случаях он работает, мне не удалось.
После этого методом проб "логичных" в данной ситуации комбинаций вышеуказанных методов и свойств был получен следующий код:
TextBoxWatermarkExtender_tbFirstName.ClientState = "Focused";
Page.SetFocus(tbFirstName);
который тоже не работал [:)].
Но, поместив его в метод OnPreRender, я наконец получил желаемый результат:
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
TextBoxWatermarkExtender_tbFirstName.ClientState = "Focused";
Page.SetFocus(tbFirstName);
}
P.S. Вроде бы такая мелочь, а тут целая статья получилась на эту тему [:)].
Компании из статьи
| Microsoft Украина |  Украинское подразделение компании Microsoft. |