0

I use an to show a message while running some code via a JsonRpcService. Works like a charm.

Now, I would like show a similar message saying "Please wait..." when the user submits a page. In this particular case it is logging in - where I need to read a lot of data to show the user. I submit the login info in a custom control when the user presses the icon (=button):

<xp:image url="/arrowGrey.png" id="submitButton" styleClass="submitButton" alt="Login" title="Login">
    <xp:eventHandler event="onclick" submit="true" refreshMode="complete">
        <xp:this.action><![CDATA[#{javascript:Logon.submit()}]]></xp:this.action>
        <xp:this.onStart><![CDATA[console.log('Start login');
setTimeout(function () {
    XSP.openDialog('#{id:working}');
}, 300);]]></xp:this.onStart>
    </xp:eventHandler>
</xp:image>

Logon is a managed bean. However, I never see the dialog box... - nor the "Start login" message?

The definition of the is:

<xe:dialog id="working" styleClass="inProgress">
    <xp:div>
    <xp:text escape="true" id="computedField1" tagName="h2" value="Logging in. Please wait..."></xp:text>
    </xp:div>
</xe:dialog>

Any ideas as to how to obtain this?

The obvious next challenge is to close the dialog should the Logon.submit() fail validation and keep the user on the current page... :-)

John Dalsgaard
  • 2,797
  • 1
  • 14
  • 26
  • 1
    A really simple solution would be this one: http://www.bootstrap4xpages.com/bs4xp/demos.nsf/doMoreWithButtons.xsp (click on the top button). And it's built in with Bootstrap. – Mark Leusink Apr 01 '14 at 15:03
  • Mark, interesting - though I have an icon as "button", so really not any space to write anything on. Perhaps there is another bootstrap "feature" I can use....? I'll have a look. – John Dalsgaard Apr 02 '14 at 08:39
  • How about this: http://stackoverflow.com/questions/14793367/how-to-add-a-spinner-icon-to-button-when-its-in-the-loading-state – Mark Leusink Apr 02 '14 at 09:13
  • Nice idea - although i really wanted a more "visible" solution (with a more specific message). But perhaps I'll have to rethink that... – John Dalsgaard Apr 03 '14 at 07:24

2 Answers2

1

If you are doing a Full refresh then the standby widget will not work. it only works on partial refreshes because a full refresh will reload everything on the page. But the standby widget is using a standard Dojo function that you could use.

Or what I usually do when I have some of code that needs to be executed. I send the users to a "please wait XPage" with an animated gif. The trick is that the code can't start executing before the page and the gif is loaded so I add the code to a hidden button and in the onload event I click this button using client side JS that executed the backend code. And when I'm done processing, I send them to the right page using context.reloadPage

This works very well.

Fredrik Norling
  • 3,461
  • 17
  • 21
  • Ok... Well, it is a "submit" and therefore a full refresh. If validation fails the user stays on the same page - with the error message. Hmmm.... not sure what way to go. – John Dalsgaard Apr 02 '14 at 08:34
  • Check out how the login on openntf.org works and do your own variant of that – Fredrik Norling Apr 02 '14 at 10:31
  • Yes it is a different concept with an Ajax login. Hmmm.... perhaps I'll have to change it to something like that - just really didn't want to refactor it too much ;-) – John Dalsgaard Apr 03 '14 at 07:22
0

Fredrik Norling created the very cool "Standby Custom Control" (http://openntf.org/XSnippets.nsf/snippet.xsp?id=standby-dialog-custom-control). It doesn't show a message but a spinning wait icon on every partial refresh that might endure longer as 200ms (you can tweak this down or up if you want to).

Oliver Busse
  • 3,375
  • 1
  • 16
  • 26