Scroll to rounded tab automatically

[CaseyR]

Hi,

I have a memory form that accepts user's parameters on one rounded tab and then when these are 'saved' it calls the form again to display the output on the tab below.  Works great for desktop but for mobile the second tab is below the visible area, so the user has to scroll down to see the results.

I would like the browser to scroll down to the display tab on 'saving'.  Javascript looked like the was to go and I can get it conditionally included in the html source with something like this:

document.getElementById("tabmyform1");
document.scrollintoview();

But scrollintoview is listed as experimental with limited browser support and Firebug shows it as an unrecognized function.

Any suggestions to achieve the effect?

Happy to bring it up at the user group tomorrow.

[Bruce]

https://caniuse.com/#search=scrollintoview
suggests that it's safe to use - at least for now. On some systems it will "jump" to the place, not scroll there, but it seems like support is pretty much universal.

cheers
Bruce

PS - Firebug was terminated a long time ago, so the reports from that are likely inaccurate. I've switched to using Developer Tools - mostly in Chrome now.

[CaseyR]

As you suggested in the user group this morning, I add the scripts to an example app and got the same scrollIntoView unrecognized function error.

Here is the revised web2.app (Basic with Menu).   I changed the MailControlBrowse to call the MailControlForm as a page rather than a popup and added some Display text at the bottom of the AutoResponder tab.  I have included two sets of script code:

1)  In the Javascript on Generate field of the demo Display there is document.getElementById("tab_mailboxesformcontrol2_div") and document.scrollIntoView() ;

2)  In the Value embed for the demo Display there is p_web.jQuery('#tab_mailboxesformcontrol2_div','scrollIntoView','')

Both generate what looks like good script code in the page source view, but the Developer Console shows the same error for both.

Thanks.

[Bruce]

use get to get the actual element...

$("#tab_mailboxesformcontrol2_div").get(0).scrollIntoView()

so
p_web.script('$("#tab_mailboxesformcontrol2_div").get(0).scrollIntoView()')

[CaseyR]

Thanks, Bruce

That works perfectly for one of my forms that conditionally includes a browse procedure on the display tab but not on another form that just has a Display control on the tab.  The problem is focus which you have dealt with before but I suspect there has been a change in the templates since the topic was discussed in 2014.  I will open another topic for the details because the issue will affect other functions besides scrolling.

Thanks again.