xpages - partial refresh - hide button based upon number of characters entered

Question

in my xpages application I want to control the visibility of a submit button (or disabled property) depending on the amount of characters entered in a field (xp:inputText).

I have implemented the xsnippet for partial refresh https://openntf.org/XSnippets.nsf/snippet.xsp?id=standby-dialog-custom-control but if I calculate the length of the value in the input text control which each key event the refresh dialog appear.

how can I avoid this? can I temporarily avoid the standby dialog to appear or should I do it client side with javascript?

add a client side script that do not allow the user to enter more than x chars. No message to the user or reload is needed. Just prevent typing when reaching max chars. — Thomas Adrian

Stanislaw Guzik Stanislaw Guzik · Accepted Answer · 2018-02-01T22:19:40

If you really need to calculate the length of the value in your input text control on each key event using client-server roundtrip (e.g. if you want to ensure that no one will hack your client-side JS), and assuming you use the forementioned XSnippet and don't want the standby dialog to appear on every key press, here what you need to do in general:

when you do XSP.partialRefreshPost, you can pass the options object as the last function parameter. Just add one more property to this object (if you've already put something into it) or create the new object with a single property, it must be something like
```
XSP.partialRefreshPost('#{id:yourId}', {dontShowDialog: true})
```
this options object is passed all the way down to line#39, where the partialrefresh-start event is published and exposes that object as the last element
line#137 subscribes to this event. Add one more parameter to the function it declares, like
```
dojo.subscribe('partialrefresh-start', null, function(method, form, refreshId, options)
```
now you are able to read your options in function's body

kinda wrap two next lines that create dialog with the conditional statement based on your options parameter. The whole thing can look like this:

dojo.subscribe('partialrefresh-start', null, function(method, form, refreshId, options) {
    if (options) {
        if (options.dontShowDialog) return;
    }
    StandbyDialog_Do = true;
    StandbyDialog_Started();
});

All written above is for the case when you use client-side event handler (the one with submit property set to false. If you use server-side handler, things are getting a bit complicated, because you can't pass any additional custom properties to the finally called _partialRefresh method. However, I can think of one way to handle this:

before calling _partialRefresh method, the CSJS engine makes some preparations, one of which is setting particular values to some hidden input fields on the page. Here we are interested in $$xspsubmitid field, which is given the value of your declared event handler client id. Then you can read the value of $$xxpsubmitid field in your hijacker XSnippet, and if it contains the ID of your event handler - don't show the standby dialog. This way is far less flexible, but should work

P.S. Haven't tried myself the all written above, but if you gonna try and fail, I'll be glad to investigate and fix.

xpages - partial refresh - hide button based upon number of characters entered

2 Answers