Looking to switch from Bubble but wanted to make sure I can do this before investing too much time. I don’t need to know how to do it just if it’s possible.
First example is above, can I do something like this where I have locations, and then expand them to see the products under them, while also being able to check certain ones off and take action on them?
And then also like this, where I can expand a table row to show things like maps etc:
I know Wappler is all about custom code so I’d imagine I can do whatever I want but just wanted to verify first before spending too much time learning it only to find out I can’t do something. Thanks!
Yes on both counts. And just to clarify, Wappler is not all about custom code — I would say it is about producing standards based code through a visual interface, with the OPTION of adding/using custom code.
I’ve looked at that but couldn’t really figure out how to make it work in a repeat table. I have a repeat table connected to a paged query, which is the “parent” records, and would like to show the related “children” in an expandable region under each parent.
Something like the above example:
OK thanks for your reply. That’s kinda what I thought, but wondered what @mebeingken was referring to when he said yes to the original question. I was hoping someone knew a way to do it without going to a third party.
Hi Dan it’s not really clear what are you trying to achieve exactly.
Do you want to use an HTML table? Or just rows with records (not <table>)?
If you want to use tables, you can manually do what you need by nesting a bootstrap collapse component in your table row …
Or if it’s the other way round you can nest tables inside your collapses … i just don’t understand what do you need to achieve.
I’m not sure what the proper terminology is, but what I’d like to do is show a list of records with an icon on each row that would expand that row and show detail records for that row.
For instance, if you’re familiar with the Northwind database, let’s use the Orders and Order Details tables as an example. Using the Table Generator, define a table connected to a paged query that returns the Orders and related Order Details for each record. The table needs to display each order as a row, and then when the user clicks the expand icon, show the order details for that given order. I need it to be a paged query because I want to have a paging component below the table. Hope that makes sense.
Yes that is possible, but you will need to custom code this.
You need to use nested repeats on the server side and either nest a table within in an existing table row > td or use collapses with nested tables inside. No point-and-click solution out of the box.
OK, I’m not afraid of custom coding it, so I’d be interested in more detail.
Can I use a paged query on the server side, or do I have to use a multi query and build the paging properties somehow? I know how to use a repeat and loop over the data returned by the query, but can’t figure out how to get the data into the right structure.
With this server side code:
This is the data and it’s the correct, but OrderDetails is not part of the data property like it probably should be:
For the paged query, you will need to use the “repeat” as a source for the dynamic table on the front end and then use the paged query itself for the paging.
OK, I think I followed that and got it working. So basically, we’re ignoring the data property of the paged query and using the output of the repeat. Redundant data, but so far so good.
I now have an OrderDetails array for each row in the Orders array and it’s available on the front end but I can’t figure out how to display it. I used the table generator to create another table but its showing the data from the first row only. And it just wants to show it above or below the Orders table.
That's only because of the way the paged query works. When working with regular queries you only use the repeat and disable the output of the query itself.
What do you mean? What's the code for both repeats on your page?
For the Orders table: <tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="sc_orders.data.repeat" id="tableRepeat1" dmx-state="qm_orders" dmx-sort="sort" dmx-order="dir">
And for the OrderDetails table: <tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="sc_orders.data.repeat[0].OrderDetails" id="tableRepeat2">
I know repeat[0] is not correct, but I’m not sure what it should be.
As you can see, the details are correct by the OrderID
But the layout is not quite what I’m looking for yet. I just added another Cell (td) and inserted the OrderDetails table into that cell. But its showing its showing it as another column on the right and I’d like ti to be an expanded area of some sort under each row.
