[英]Set focus to child in web user control
I've created a web user control for phone number entry that has 3 text boxes for the area-code, number, and extension. 我创建了一个用于电话号码输入的Web用户控件,该控件具有3个文本框,分别用于区号,号码和分机。 The text boxes are in a table for positioning and the table is inside a span.
文本框在表格中以进行定位,表格在跨度内。 In the page that uses the control I have
<asp:Label ID="Label6" runat="server" AssociatedControlID="uxPhoneNumber">Phone</asp:Label>
在使用控件的页面中,我有
<asp:Label ID="Label6" runat="server" AssociatedControlID="uxPhoneNumber">Phone</asp:Label>
What I want to do is set the focus to the area-code input when the associated label is clicked on. 我想要做的是,在单击关联的标签时将焦点设置为区号输入。 Does the web user control get the focus when the label is clicked, or can I change the html in the ascx so this works?
单击标签时,Web用户控件是否会获得焦点,或者我可以更改ascx中的html从而起作用吗? I have tried adding
onfocus()
to the <span>
tag, and the <table>
tag so I can use a javascript to set the focus, but the event is not raised. 我尝试将
onfocus()
添加到<span>
标记和<table>
标记中,以便可以使用JavaScript设置焦点,但不会引发该事件。 If I move the onfocus() event to the first input it fires and my script runs 如果我将onfocus()事件移至第一个输入,则它将触发并运行脚本
Here is the complete ascx code. 这是完整的ascx代码。
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="PhoneNumber.ascx.cs" Inherits="CustomControls.PhoneNumber" %>
<span id="uxPhoneNumberControl" runat="server" style="display: inline-block;" onfocus="setInitialFocus()">
<asp:Table ID="uxPhoneNumberTable" runat="server">
<asp:TableRow runat="server">
<asp:TableCell runat="server">
<telerik:RadMaskedTextBox ID="uxAreaCode" runat="server" Columns="3" Mask="###" CssClass="span1" Skin="" MaxLength="3"></telerik:RadMaskedTextBox>
</asp:TableCell>
<asp:TableCell runat="server">
<telerik:RadMaskedTextBox ID="uxPhoneNumber" runat="server" Mask="###-####" Skin="" Columns="10" CssClass="input-mini" MaxLength="8"></telerik:RadMaskedTextBox>
</asp:TableCell>
<asp:TableCell runat="server">
<asp:Label ID="uxExtensionLabel" runat="server" Text="Ext." AssociatedControlID="uxExtension" CssClass="controls-label"></asp:Label>
</asp:TableCell>
<asp:TableCell runat="server">
<telerik:RadMaskedTextBox ID="uxExtension" runat="server" Columns="5" Mask="#####" Skin="" CssClass="span1"></telerik:RadMaskedTextBox>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
<asp:HiddenField ID="uxPhoneEntity" runat="server" />
</span>
Try attaching a jQuery click event to the span and then setting focus to the input, like this: 尝试将jQuery click事件附加到跨度,然后将焦点设置为输入,如下所示:
$(document).ready(function(){
$('#uxPhoneNumberControl').on('click',function(){
$("#InputID").focus();
});
});
Note: I have put a general name of InputID
in the focus()
call, because I am not able to tell what ID or class you are using to uniquely identify the area code input control you want to set focus towards. 注意:我在
focus()
调用中输入了InputID
的通用名称,因为我无法告诉您使用什么ID或类来唯一地标识您要设置焦点的区域代码输入控件。
Your setInitialFocus()
function should look something like this: 您的
setInitialFocus()
函数应如下所示:
function setInitialFocus()
{
var area = document.getElementById("<%=uxAreaCode.ClientID%>");
area.focus();
return true;
}
This locates the uxAreaCode
object and forces it to take focus. 这将定位
uxAreaCode
对象并强制其聚焦。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.