Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Developer
Posts: 46
Registered: ‎06-02-2013
My Device: 9780
My Carrier: MTS UKR

Focus event on page load not working in BB10

[ Edited ]

For my text area I use the following:

document.getElementById("mytextarea").focus();

The problem is that in the VMware BB10 emulator and on real BB10 devices the focus is not set to the textarea. Yet, Ripple shows me everything works correct and the textarea gets focus as it should. This script is added after the textform.

I also tried using:

<textarea id="mytextarea" autofocus></textarea>

 But this does not work as well. What am I missing about it?

Retired
Posts: 1,561
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: Focus event on page load not working in BB10

Hi there, can you provide a basic index.html that shows a full/sample implementation? Just the bare bones of what you're doing. I'm happy to give it a test here.

Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Developer
Posts: 46
Registered: ‎06-02-2013
My Device: 9780
My Carrier: MTS UKR

Re: Focus event on page load not working in BB10

<div data-bb-type="screen" data-bb-effect="fade">
	<div id="screen" data-bb-type="title" data-bb-caption="myapptitle"></div>
	<br>
	<script type="text/javascript">
		mystufftodo();
        </script>
	<div>
	<form name="myform">
		<textarea id="text" autofocus></textarea>
	</form>
	<script>
	  	document.getElementById("text").focus();
	</script>
	</div>
	<div data-bb-type="action-bar">
		my action bar stuff
	</div>
</div>

This is a simplified screen pushed from index.html - exactly in this screen, which is main to my application, the focus is not set to the textarea. I tried both on Z10 and VMware simulator 10.2.0.1155.

Would be grateful for any insight into the problem.

Retired
Posts: 1,561
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: Focus event on page load not working in BB10

[ Edited ]

Ah, so the issue lies with how bbUI.js handles page loading.

The first page that bbUI.js actually loads, we'll call index.html. In there is where we initialize BBUI and then call pushScreen for our very first "actual" page. In our case, let's assume it's for the screen you posted above.

The thing is that bbUI goes through your page and replaces all of the content with its own "formatted" elements. And, at the time of loading the page, the "document" doesn't *actually* contain the "text" element. EDIT: It's still contained in memory; as opposed to existing on the document.

BBUI does provide ondomready events where you can listen for your screen's ID and then take action. However you want to use the "element" variable, instead of "document". Example:
element.getElementById('text").focus();

Again, this would be inside the ondomready event, not as an embedded script inside your page. You can find more information for ondomready here:
https://github.com/blackberry/bbUI.js/wiki/Toolkit-Initialization#ready-events

Let me know if you have any questions.


Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Developer
Posts: 46
Registered: ‎06-02-2013
My Device: 9780
My Carrier: MTS UKR

Re: Focus event on page load not working in BB10

[ Edited ]

Thanks for the links. I went through them, but I still can't get it working.

To get the things most simple for me to figure out, now I decided to modify a little bit the BFB sample app from the Github repository. Sure thing, I didn't forget to add my text field to the main.html screen.

What I did is simply added:

element.getElementById('text").focus();

 into the welcome() finction of the app (fired at ondomready, actually). I didn't get it working that way (though the Welcome toast is shown, no focus event happens). What is wrong now?

Retired
Posts: 1,561
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: Focus event on page load not working in BB10

I think I may have advised wrong.

On domready, we're still using the element variable to access the page contents (i.e. the text element.) Calling focus there likely won't do anything since the element is still existing in memory, not on the actual dom.

What we need is some sort of way to monitor when the page is actually displayed live to the user on the actual document, and then call focus. I'll see if I can find such a trigger.

Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Developer
Posts: 46
Registered: ‎06-02-2013
My Device: 9780
My Carrier: MTS UKR

Re: Focus event on page load not working in BB10

Would be very grateful, if it could be figured out.

Retired
Posts: 1,561
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: Focus event on page load not working in BB10

[ Edited ]

Okay, one more attempt. From the documentation:

 

You can also be notified when your screen, and all associated <script> tags, have been inserted into the DOM using the ondomready event. This allows you to perform your data manipulation after the screen has been displayed to the user.

 

So it seems that ondomready should suffice here. Can you please try calling focus() on your element within the ondomready function, however instead of using element.getElementById... you would use document.getElementById... to get the element to call focus() on.

 

EDIT: Fixed typo.

 

If that does not work, potentially wrapping the call to focus() inside of a webkitRequestAnimationFrame or setTimeout(..., 0) may do the trick.

 

If this still does not work, can you please share the full bb.init function you are calling to set up BBUI?


Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Developer
Posts: 46
Registered: ‎06-02-2013
My Device: 9780
My Carrier: MTS UKR

Re: Focus event on page load not working in BB10

OK, thanks for the suggestion, will give it a try now and let you know the result.

Retired
Posts: 1,561
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: Focus event on page load not working in BB10

[ Edited ]

Just wanted to follow-up to see if you had any luck.

 

Edit: Bumping this one more time.


Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.