How To Wait For Select Value to Populate

Wappler General Need Help
1

Hi.
I have a pages query in a SA, and the SC on page has binding for offset from query manager and limit from a select/dropdown on the page.
Since the SC is auto-loaded, when the page opens, it gets called with limit as empty. And within a few ms, it gets called again, cancelling the first request - with a limit value from the select.

This select has static binding of 25,50,75,100 values and 50 is selected by default.

I have tried using selectLimit.value.default(50) in the SC binding as well, but that does not work.
I also tried setting a page flow, keeping the SC on no-autoload and load it from the flow, but it still sends blank value for limit.
If I add a wait of say 100ms inside the flow, it start working - but that is just a random wait time working in this instance and might easily fail in the future.

Any ideas on how to set this up so that default value can be passed to SC without needing a second call?

1 Like
2

This is an excellent question.
Some day I may be smart enough to answer it.
But Iā€™m following this thread . . .

3

Have you tried adding .default(50) in the server action to your limit GET variable?

4

That does not solve the core problem of two SA calls from client side.

I can actually just make the GET param required, which fails the first call with 400. So not really a solution.

6

You can use a dynamic noload:

dmx-bind:noload="selectLimit.value ? '' : 'noload'"

That way the SC wonā€™t be called until the select actually has a value

7

That is another good workaround that I have used before.
But I am still awaiting some insight on why this issue happens.

8

I think youā€™ll find that it is 2 events that trigger the SC, page load and parameter change, it would be pretty much impossible for the SC to predict that a parameter is going to be updated so it has to fire on page load and then subsequently when the value is updated.

If you know this is going to happen, that is when the dynamic noload comes in. I do think a ā€˜requiredā€™ checkbox in the SC UI next to where the parameters data bindings are set might be useful. That way the SC isnā€™t called if a required parameter is missing.

9

What I don't understand here is the select list that I have is static.. So there is no parameter change. So could it be a bug or inefficiency in AppConnect?

10

:man_shrugging:
Curiosityā€¦ can you show your select element code?

11 
<select class="form-select" id="selectFilterLimit" required="" dmx-on:changed="qm.set('offset',0);browser1.scrollYTo(0)">
        <option value="10">10</option>
        <option value="25">25</option>
        <option value="50" selected="true">50</option>
        <option value="100">100</option>
      </select>
12

In your first post the id is selectLimit and in the select code it is selectFilterLimit

is that deliberate?

I thought you might have a data binding to a session/local storage item which caused the ā€˜updateā€™ but no - I canā€™t see why it would need to fire twiceā€¦ (unless one of the flows you set up is still triggering)

13

Just a typo.

No, thats not it. Have checked.

1 Like
14

Sorry I canā€™t help moreā€¦

15

@patrick Bump.

16

I donā€™t have time to look at it now, but perhaps you could provide me some extra information.

From what I understand is that it only happens on the initial load, does it happen in the stable and the new beta of App Connect? When you load the SC later, so having noload and then load it later with a button click, does it then include the limit option? Also you can try to move the SC component to the end of the page, so that it is placed after the select component.

17

I am still on 4.6.2.

Yes. If there is a delay, the binding works fine.
The setup I have right now is using an autorun flow - first setp wait 100ms, second step call SA.

That did not make a difference. The limit value still did not go through.

18

Is the select also directly vissible or is it perhaps inside a conditional or data detail component? With a simple test page Iā€™m not able to reproduce the problem, if you have a test page which shows the problem for me to test it would be helpful.

19

Noā€¦ there is no CR or anything.
I will share an Ngrok link via message.

20

lol this might sound stupidā€¦ but one way i show the amount of OFFSET recordsā€¦ i take the ā€œresolutionā€ of the deviceā€¦ if the device is smallā€¦ i call up 10 recordsā€¦ if the screen is bigā€¦ i then make the offsetā€¦ 100ā€¦

so that my user dont have to select from the listā€¦ the bigger the deviceā€¦ the more records i call,

<dmx-value id="smallscreen_offset" dmx-bind:value="(browser1.viewport.width <= 767) ? 20 : ''"></dmx-value>
                    <dmx-value id="mediumscreen_offset" dmx-bind:value="(browser1.viewport.width.inRange(768, 991)) ? 10 : ''"></dmx-value>
                    <dmx-value id="largescreen_offset" dmx-bind:value="(browser1.viewport.width.inRange(992, 1199)) ? 20 : ''"></dmx-value>
                    <dmx-value id="xlargescreen_offset" dmx-bind:value="(browser1.viewport.width.inRange(1200, 1399)) ? 50 : ''"></dmx-value>
                    <dmx-value id="xxlargescreen_offset" dmx-bind:value="(browser1.viewport.width >= 1400) ? 100 : ''"></dmx-value>

                    <dmx-value id="offsetdatalimit" dmx-bind:value="{{smallscreen_offset.value}}{{mediumscreen_offset.value}}{{largescreen_offset.value}}{{xlargescreen_offset.value}}{{xxlargescreen_offset.value}}"></dmx-value>

then in my SCā€¦
dmx-param:offset="query.offset" dmx-param:limit="offsetdatalimit.value"

and then will set the limitā€¦

so as i re-size the screen it will change the Limitā€¦ :slight_smile:
working hereā€¦ https://auctionsoft-2.co.za/auction-lots/5/