Solved

Javascript and Ajax Updatepanel Postbacks

Posted on 2010-11-27
9
477 Views
Last Modified: 2012-05-10
Hello experts!

Here is the code that is causing me trouble.

function check() {
                  document.getElementById("InputBoxTypeText").focus();
        }

        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(check);

Open in new window


My understanding of this is that after a postback, it should set the focus to the text input, however this does not appear to work.  In order to debug, I added an alert() to the javascript:

function check() {
                  alert("test");
                  document.getElementById("InputBoxTypeText").focus();
        }

        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(check);

Open in new window


When I run this, the alert comes up and then the focus is set correctly.

Any ideas?  I'm sure i'm missing something fairly obvious...

Thanks,

DT
0
Comment
Question by:DreadedTuesday
  • 5
  • 4
9 Comments
 
LVL 18

Expert Comment

by:Sudaraka Wijesinghe
ID: 34221608
Call to the check() function probably comes before the InputBoxTypeText element is rendered properly. That explain why it works when add the alert, that delays the call to focus.
Try using the pageLoaded event instead of the endRequest.
0
 
LVL 1

Author Comment

by:DreadedTuesday
ID: 34221614
sudaraka,

Thanks for the suggestion; unfortunately I get the same symptoms.

DT
0
 
LVL 18

Accepted Solution

by:
Sudaraka Wijesinghe earned 500 total points
ID: 34221632
Is the element InputBoxTypeText on the page and enable when the focus is called? Do you see any JavaScript errors?

Try some thing like below. experiment with the delay to see if delaying the call make it works.
function check() {

                  window.setTimeout(document.getElementById("InputBoxTypeText").focus(), 2000);

        }



        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(check);

Open in new window

0
 
LVL 1

Author Comment

by:DreadedTuesday
ID: 34221648
Wow, that seems to do it!  Nicely diagnosed, I had not even considered that.  Looks like my skills are rustier than i thought...
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 18

Expert Comment

by:Sudaraka Wijesinghe
ID: 34221679
Glad to hear it worked. But I wouldn't use a delay as a final solution for this as it would still fail in a situation like in a slow internet connection.
You will need to find out an event that make the element focusable and call the check function from there, or make sure the element is focusable when the  pageLoaded or on endRequest events occur.
0
 
LVL 1

Author Comment

by:DreadedTuesday
ID: 34221728
Do you have any suggestions?  The text input in question needs to be in focus to accept input from a handheld barcode scanner (it enters data into whatever is in focus at the time).  I have it getting the first one, but when it updates and returns the page it needs to reset the focus so the user doesnt have to manually select the box again.
0
 
LVL 18

Expert Comment

by:Sudaraka Wijesinghe
ID: 34221899
Does the page reload after submitting the first one? if so, you can call this code on window.onload or dom ready event.
0
 
LVL 1

Author Comment

by:DreadedTuesday
ID: 34221923
the whole page doesnt reload, just the updatepanel.  I have it doign this at the moment:

            var elem = document.getElementById("InputBoxTypeText");
            elem.focus();
            while (elem != document.activeElement) {
                elem = document.getElementById("InputBoxTypeText");
                elem.focus();
            }

Open in new window

0
 
LVL 18

Expert Comment

by:Sudaraka Wijesinghe
ID: 34221926
Nice workaround!
Thanks for the points.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
html form to write data to csv 24 95
Angular - following an example but mine partly works 17 45
Enter key on html form page 11 44
Change text to radio button and calendar form 2 32
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

930 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now