javascript .focus() to operate with tab
For some reason none of my setfocus() events were working on the server side of my web app, so I created a Javascript function setfocus that is set to trigger on the onload event of the body tag.
<body onload="SetFocus()">
The user will click a radio button which enables the drop down. they select from the drop down which enables the textbox. When they scan a barcode into the textbox it will automatically tab out of the field, therefore triggering the onchange event to call some server side code which, if a successful SQL insert is completed, will insert a new row to the gridview, and it should set focus automatically back to the textbox via Javascript. Once that gridview object has more than a header and a row of data, I disable the drop down and radio button list, so if you look at the Javascript below, I can't use those as criteria in my if statement anymore.
Javascript:
var MatAllRB = document.getElementById("HF_RB_MatAll").value;
var MatAllCL = document.getElementById("DD_SelectCL_All").value;
var MatAll = document.getElementById("Txt_MatBC_All");
var MatAllPrompt = document.getElementById("HF_AllPrompt").value;
var count = $("#GV_Scan_All tr").children().length;
This works perfectly:
else if (ActiveTab == "cont-3" && MatAllRB != "" && MatAllCL != "")
{ alert("went into setfocus");
document.getElementById("Txt_MatBC_All").focus();
alert("made it through setfocus");
}
This only works if you actually click off the field, the tab doesn't work. It just does nothing.
else if (ActiveTab == "cont-3" && count == 9)
{ alert("went into setfocus");
document.getElementById("Txt_MatBC_All").focus();
alert("made it through setfocus");
}
This does the same thing as the above:
else if (ActiveTab == "cont-3" && (MatAllPrompt == "RP" || MatAllPrompt == "P03"))
{ alert("went into setfocus");
document.getElementById("Txt_MatBC_All").focus();
alert("made it through setfocus");
}
The weird thing is that all of these alerts that I have in here show up correctly, it just never sets focus. I am pretty new at this stuff still, so maybe I'm missing something, but I can't figure out why the focus() will work for click off rather than tabbing off. Any help would be appreciated.
Here's the HTML:
<asp:RadioButtonList runat="server" ID="RB_Mat_All" AutoPostBack="true" RepeatColumns="4"开发者_如何学运维 OnSelectedIndexChanged="RB_Mat_All_OnSelectedIndexChange">
<asp:ListItem Text="NC" value="NC"></asp:ListItem>
<asp:ListItem Text="DA" value="DA"></asp:ListItem>
<asp:ListItem Text="GW" value="GW"></asp:ListItem>
<asp:ListItem Text="PC" value="PC"></asp:ListItem>
</asp:RadioButtonList>
<asp:HiddenField runat="server" ID="HF_RB_MatAll"></asp:HiddenField >
<br />
<asp:DropDownList runat="server" ID="DD_SelectCL_All" AutoPostBack="true" OnSelectedIndexChanged="DD_SelectCL_All_OnSelectedIndexChange">
<asp:ListItem Value="" Text="Select..."></asp:ListItem>
<asp:ListItem value="53" text="05"></asp:ListItem>
<asp:ListItem value="54" text="06"></asp:ListItem>
<asp:ListItem value="55" text="07"></asp:ListItem>
<asp:ListItem value="57" text="08"></asp:ListItem>
<asp:ListItem value="58" text="09"></asp:ListItem>
</asp:DropDownList>
<asp:label runat="server" ID="Lbl_All_Prompt" CssClass="Form" Text=""></asp:label>
<asp:HiddenField runat="server" ID="HF_AllPrompt"></asp:HiddenField >
<asp:TextBox runat="server" ID="Txt_MatBC_All" Cssclass="Form" Text="" AutoPostBack="true" OnTextChanged="Txt_MatBC_All_TextChanged"></asp:TextBox>
<asp:GridView runat="server" ID="GV_Scan_All" CssClass="Form_Feedback"></asp:GridView>
When I view the source the textbox looks like this:
<input name="Txt_MatBC_All" type="text" onchange="javascript:setTimeout('__doPostBack(\'Txt_MatBC_All\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="Txt_MatBC_All" class="Form" />
It's odd that you can click off the field and it works, but tabbing off doesn't. Try adding tabIndexes to the inputs on your page.
The ids of your text box, change when the asp.net render the page. So try this to get the id dynamically and see if its works.
document.getElementById("<%=Txt_MatBC_All.ClientID%>").focus();
The same way you must use the ClientID on every getElementById you use.
by the way, on every line you focus the same text control (Txt_MatBC_All). If this is the case, why you make all that if, just use one line.
- tip 1: you can see if your getElementById found the control by make teamporary an alert call like
alert(document.getElementById("<%=Txt_MatBC_All.ClientID%>")); - tip 2: Right click on your browser and see the source code of your page to see what ids your control have take, to see if you actually is correct and the same with the javascript you use.
Try converting your JavaScript to square bracket notation. For example: document.forms[0].Txt_MatBC_All.focus();
加载中,请稍侯......
精彩评论