Knowledge base

IT is a great and exciting world to be in.
All who have passion for it will understand why we have created these pages.
Here we share our technical knowledge with you.
ProgrammingAICloudManagementMobileDB & AnalysisSafetyOtherArchitectureTips

ASPX Textbox focus issue

25/2/2012

Libor Bešenyi (Solution architect)

We were experiencing losing focuse of ASPX textboxes embedded in Ajax update panel. jQuery helped again.

<asp:TextBox ID="TextBoxStoreys" runat="server" Width="60px" AutoPostBack="true" />

Pressing tab on this control fired server-side on change event (this is correct), but next focused element was lost.

We have implemented hidden field in general master page which keeps last fired element ID and 2 java-script routines: First stored fired control ID and second has catch ending of asynchronous request. Than find next possible element (which is focused manually).

...
<asp:HiddenField ID="hiddenFieldLastAutopostbackFiredElement" runat="server" />
...
       <script type="text/javascript">
             //<![CDATA[
             Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
                    function (sender, e)
                    {
                           // #6220 Save latest focus (textbox autopostback issue)
                           var inputHoldsLastFocus = getElement("hiddenFieldLastAutopostbackFiredElement");
                           if (inputHoldsLastFocus.value)
                           {
                                  var lastControl = getElement(inputHoldsLastFocus.value);

                                  // Focus next control
                                  var allPossibleElements = $('input:text');
                                  var index = allPossibleElements.index(lastControl);

                                  if (index >= 0 && index + 1 < allPossibleElements.length)
                                  {
                                        var nextElement = allPossibleElements[index + 1];
                                        nextElement.focus();
                                        nextElement.select();
                                  } // if

                                   inputHoldsLastFocus.value = null;
                           } // if
                    });

              function AutoPostBackTextBox(control)
             {
                    // #6220 Save latest focus (textbox autopostback issue)
                    var inputHoldsLastFocus = getElement("hiddenFieldLastAutopostbackFiredElement");

                    inputHoldsLastFocus.value = control.id;

                     __doPostBack(control.id, "");
             }
             //]]>
       </script>
</asp:Content>

AutoPostback on the textbox was removed, as you can see is postback raised within the storing the last element ID:

<asp:TextBox ID="TextBoxStoreys" runat="server" Width="60px" onchange="javascript: AutoPostBackTextBox(this);" />

 

 

 

Find out more

ProgrammingTips

Quick start

1
Contact
Contact us for a free consultation on your business needs!
2
Analysis
After the discussion we will perform mapping of the processes and analyse the current state.
3
Proposal
You will receive variety of scenarios to choose from discribing different ways how to solve your issue.
Contact us