Table Generator Doesn't Accept State Manager Choice

jimed99 · May 23, 2025, 8:21am

Wappler Version : 7 b32
Operating System : W11 Pro
Server Model: Nodejs
Database Type: Mariadb
Hosting Type: DO/Caprover

Expected behavior

The selection of State Management accepts the choice made by the user.

Actual behavior

State Manager select shows all of the available Query Managers, but only uses the first choice.

How to reproduce

Have 3 query managers and a cookie manager setup. This is what displays in the State Manager list when opened.

Run table generator.
Select the last choice.

The first choice is the only one that displays.

Tried to share a recording but it did not capture the Table Generator window, just the mouse movement.

Teodor · May 23, 2025, 8:33am

What do you mean here exactly?

jimed99 · May 23, 2025, 8:36am

In the first image you see I select inviteSort, and table generator uses termsort not my selection of inviteSort

Teodor · May 23, 2025, 8:48am

It makes no sense to create multiple session storage managers, you only need one on your page. They all show the same variables as they are stored in the browser session storage.
You only need one session manager on your page.

jimed99 · May 23, 2025, 8:59am

I have 4 tab panels with tables. The dir/sort on the tables was not working as it isn't now for this new table. AI Assistant troubleshooting suggested adding another query manager different name - thus 3 - and that change resulted in the dir/sort in the table head to work on the first two tables.

Teodor · May 23, 2025, 9:01am

AI can make mistakes, so do not always rely 100% on its suggestions. You only need one session manager. Define your different sort and order parameters there and then bind them to the tables where you need them.

jimed99 · May 23, 2025, 9:35am

I get the 100% issue, but I spent two days working through it and that worked.
Issue:
Click on a heading title is doesn't respond:

Here is new I just table generated. The headers don't work:

<div class="table-responsive">
                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th class="sorting" dmx-on:click="termsSort.set('sort','version_title');termsSort.set('dir',sortDir.data.dir == 'desc' ? 'asc' : 'desc')" dmx-class:sorting_asc="termsSort.data.sort=='version_title' && termsSort.data.dir == 'asc'" dmx-class:sorting_desc="termsSort.data.sort=='version_title' && termsSort.data.dir == 'desc'">Version title</th>
                                            <th class="sorting" dmx-on:click="sortDir.set('sort','template_content');sortDir.set('dir',sortDir.data.dir == 'desc' ? 'asc' : 'desc')" dmx-class:sorting_asc="sortDir.data.sort=='template_content' && sortDir.data.dir == 'asc'" dmx-class:sorting_desc="sortDir.data.sort=='template_content' && sortDir.data.dir == 'desc'">Template content</th>
                                            <th class="sorting" dmx-on:click="sortDir.set('sort','status');sortDir.set('dir',sortDir.data.dir == 'desc' ? 'asc' : 'desc')" dmx-class:sorting_asc="sortDir.data.sort=='status' && sortDir.data.dir == 'asc'" dmx-class:sorting_desc="sortDir.data.sort=='status' && sortDir.data.dir == 'desc'">Status</th>
                                            <th class="sorting" dmx-on:click="sortDir.set('sort','comment');sortDir.set('dir',sortDir.data.dir == 'desc' ? 'asc' : 'desc')" dmx-class:sorting_asc="sortDir.data.sort=='comment' && sortDir.data.dir == 'asc'" dmx-class:sorting_desc="sortDir.data.sort=='comment' && sortDir.data.dir == 'desc'">Comment</th>
                                            <th class="sorting" dmx-on:click="sortDir.set('sort','last_update_date');sortDir.set('dir',sortDir.data.dir == 'desc' ? 'asc' : 'desc')" dmx-class:sorting_asc="sortDir.data.sort=='last_update_date' && sortDir.data.dir == 'asc'" dmx-class:sorting_desc="sortDir.data.sort=='last_update_date' && sortDir.data.dir == 'desc'">Last Update</th>
                                        </tr>
                                    </thead>
                                    <tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="sc_qry_invites_list.data.qry_invites_list.data" id="tableRepeat1" dmx-state="sortDir" dmx-sort="sort" dmx-order="dir">
                                        <tr>
                                            <td dmx-text="version_title"></td>
                                            <td dmx-text="template_content"></td>
                                            <td dmx-text="comment"></td>
                                            <td dmx-text="status"></td>
                                            <td dmx-text="last_update_date"></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>

Hyperbytes · May 23, 2025, 9:49am

Just thought, have you specified the fields in your server connect query individually rather than tablename.*
Using .* will stop it working.

jimed99 · May 23, 2025, 10:01am

Hi Brian - yes I always select individual fields -
I just got it working with this change:
in the code generated that I posted the head table row looks like this <tr>
In a previous iteration I found this:
<tr dmx-on:click="sc_qry_invites_list.load({sort: sortDir.data.sort, dir: sortDir.data.dir})">
replaced it in the table code I supplied and it works there now

Is this the appropriate way to sort the table and if yes, why didn't table generator consistently supply that line? Only table code I'm referencing is created by the table generator.

Teodor · May 23, 2025, 10:03am

That is not how the code is supposed to look.
The correct code is the one generated by the table.

So check if in the server action on the page you selected the proper values (session storage variables) for the sort/dir variables.

jimed99 · May 23, 2025, 10:13am

<dmx-serverconnect id="sc_qry_invites_list" url="/api/members/invites/invites_list" noload="true"></dmx-serverconnect>

Teodor · May 23, 2025, 10:15am

I have no idea what to look at here.
If you are using a query manager to store the sort/dir values, it should also be ONE. You don't need multiple query managers. Same for session storage manager, same for cookie manager.
I am referring to the server action on your page. When you select it, in the properties you can bind the values used for sort and dir. Make sure to set the ones that you use in the table generator to store the sort and dir:

Query manager used in the table generator:

The same query parameters selected in the server action sort and dir parameters:

jimed99 · May 23, 2025, 10:24am

I just added the query manager binding. Changed it back to <tr> Doesn't work

Teodor · May 23, 2025, 10:29am

Please provide a link to your page where i can check it.
Not sure what "doesn't work" exactly, as something just seems not correctly setup, or broken by hand editing the code.

jimed99 · May 23, 2025, 10:38am

Sorry - Invites is the new table issue

Teodor · May 23, 2025, 10:47am

I see the sort parameters are sent properly:

qry_membersRole?sort=user_status&dir=asc

So this part is working ok.
The data doesn't load because of a server error.

Teodor · May 23, 2025, 10:55am

I see the 500 error is gone now, everything sorts fine on your page.

jimed99 · May 23, 2025, 11:02am

It's the Invites table, inside the Invites tab. Terms/Members were setup with the multiple query managers. I'll convert them once I see it working. Terms/Members has server calls on each table header.

Teodor · May 23, 2025, 11:04am

You are using a server action which is set to no auto load for this table. Remove the no auto load option for it.

jimed99 · May 23, 2025, 11:11am

That was it. THANK YOU - This query sort/dir has beat me for to long. I see the differences and what's missing from the other table structure.