I've two asp panels. One panel panel_srch_passenger is visible on page load and another panel panel_post_passCode is only visible after the button is pressed. Initially on page load txtPassengerId is set visible which is inside panel_srch_passenger. But
after the button pressed I need to focus on different text box which is inside the panel_post_passCode.
How can I do this using javascript? My code is not working. Please help me.
Thanks for the reply. I want to do it using client side script not from code behind. Thank You!
Try this clientside script using pure JS, it will work irrespective of panel visible or not.
<script>
window.onload=function(){
var ele = document.getElementById('<%=txtPassengerId.ClientID%>');
if(ele) ele.focus();
ele = document.getElementById('<%=txtpassCode.ClientID%>');
if(ele) ele.focus();
};
</script>
Base on your description. I make an working example.
<script type="text/javascript">
window.onload=function(){
var ele = document.getElementById('<%=txtPassengerId.ClientID%>');
ele.focus();
};
function SomeMethod() {
var ele = document.getElementById("panel_post_passCode");
ele.style.display = "block";
if (document.getElementById("panel_post_passCode").style.display == "block") {
document.getElementById('<%=txtpassCode.ClientID%>').focus();
}
return false;
}
</script>
<asp:Panel ID="panel_srch_passenger" runat="server">
<fieldset>
<legend>Search</legend>
<div class="div_labels">
<b>Patient Id :</b>
<asp:TextBox ID="txtPassengerId" runat="server" />
<asp:Button ID="btn_search" runat="server" Text="Search" OnClientClick="return SomeMethod();" />
</div>
</fieldset>
</asp:Panel>
<asp:Panel ID="panel_post_passCode" runat="server" style="display:none;">
<div class="give_labels">
<b>Passenger Code :</b>
<asp:TextBox ID="txtpassCode" runat="server" />
</div>
</asp:Panel>
Best regards
Cathy
MSDN Community Support
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.
Member
42 Points
184 Posts
focus on textbox when panel is visible
Mar 14, 2017 06:45 AM|scala_1988|LINK
I've two asp panels. One panel panel_srch_passenger is visible on page load and another panel panel_post_passCode is only visible after the button is pressed. Initially on page load txtPassengerId is set visible which is inside panel_srch_passenger. But after the button pressed I need to focus on different text box which is inside the panel_post_passCode.
How can I do this using javascript? My code is not working. Please help me.
All-Star
15186 Points
3888 Posts
Re: focus on textbox when panel is visible
Mar 14, 2017 08:14 AM|raju dasa|LINK
Hi,
You don't need JS, you can set focus using asp.net (serverside) code
Call the txtpassCode.Focus() method in button click event handler
or check this site: http://stackoverflow.com/questions/1533871/how-to-use-setfocus-on-text-box-control
try updating code like this:
rajudasa.blogspot.com || rajudasa-tech
All-Star
31362 Points
7055 Posts
Re: focus on textbox when panel is visible
Mar 14, 2017 08:50 AM|kaushalparik27|LINK
You code seems correct to me, try using Document.Ready event:
Output:

In only jQuery, script code will be:
[KaushaL] Blog Twitter [MS MVP 2008 & 2009] [MCC 2011] [MVP Reconnect 2017]
Don't forget to click "Mark as Answer" on the post that helped you
Member
42 Points
184 Posts
Re: focus on textbox when panel is visible
Mar 14, 2017 09:18 AM|scala_1988|LINK
Hi, @ raju dasa
Thanks for the reply. I want to do it using client side script not from code behind. Thank You!
All-Star
15186 Points
3888 Posts
Re: focus on textbox when panel is visible
Mar 14, 2017 09:37 AM|raju dasa|LINK
Hi,
Try this clientside script using pure JS, it will work irrespective of panel visible or not.
rajudasa.blogspot.com || rajudasa-tech
All-Star
31362 Points
7055 Posts
Re: focus on textbox when panel is visible
Mar 14, 2017 09:48 AM|kaushalparik27|LINK
Did you try client side script that I posted earlier? I saw it as working on my side. You may post if you see further issue or still not working.
[KaushaL] Blog Twitter [MS MVP 2008 & 2009] [MCC 2011] [MVP Reconnect 2017]
Don't forget to click "Mark as Answer" on the post that helped you
Star
8670 Points
2882 Posts
Re: focus on textbox when panel is visible
Mar 15, 2017 03:29 AM|Cathy Zou|LINK
Hi scala_1988,
Base on your description. I make an working example.
<script type="text/javascript"> window.onload=function(){ var ele = document.getElementById('<%=txtPassengerId.ClientID%>'); ele.focus(); }; function SomeMethod() { var ele = document.getElementById("panel_post_passCode"); ele.style.display = "block"; if (document.getElementById("panel_post_passCode").style.display == "block") { document.getElementById('<%=txtpassCode.ClientID%>').focus(); } return false; } </script> <asp:Panel ID="panel_srch_passenger" runat="server"> <fieldset> <legend>Search</legend> <div class="div_labels"> <b>Patient Id :</b> <asp:TextBox ID="txtPassengerId" runat="server" /> <asp:Button ID="btn_search" runat="server" Text="Search" OnClientClick="return SomeMethod();" /> </div> </fieldset> </asp:Panel> <asp:Panel ID="panel_post_passCode" runat="server" style="display:none;"> <div class="give_labels"> <b>Passenger Code :</b> <asp:TextBox ID="txtpassCode" runat="server" /> </div> </asp:Panel>
Best regards
Cathy
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.