Dynamic Checkbox "Checked" based on database value in table

[daves88]

Hi Wapplers,

I have checkboxes and I am trying to get them to automatically load as being “checked” based on whether they exist in a database query. I have it working when I have the [0] in the query result but only for the first one, obviously. But I am trying to have it so all checkboxes are checked if they exist in the result.

Code is as follows:

     <div id="repeat1" is="dmx-repeat" dmx-bind:repeat="searchmodules.data.searchmodulesonefunder.data.query">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" dmx-bind:id="inputCheckbox[{{$index}}]" name="inputCheckbox[]" dmx-on:checked="addmoduletolist.load({modulename: moduleName, moduleid: module_id})" dmx-on:unchecked="deletemodulelist.load({id: module_id})" dmx-bind:value="moduleName" dmx-bind:checked="searchmymodules.data.query.moduleName.split(',').contains(searchmodules.data.searchmodulesonefunder.data.query.moduleName.split(','))">
                                    <label class="form-check-label" dmx-bind:for="inputCheckbox[{{$index}}]">{{moduleName}}</label>
                                </div>
                            </div>

[famousmag]

Hey @daves88,

I’m not able to understand how your checkbox list work and when it is checked or not but I have 2 suggestions:

1. checkbox value is either 1 (checked) or 0 (unchecked)… What is the “moduleName”?

@daves88

dmx-bind:value="moduleName"

2. Why don’t you just add a multi checkbox group to handle your checkboxes?

• You need a query (an array of 1 and 0) for it… Like chkboxValues = [0, 1, 0, 0, 1, 1, 1, 0]
  If your existing query is formed like that it is OK.
• Assign this query/array to the multi checkbox group in your page.

Check this post here:

Update form with dynamic checkboxes

This is driving me nuts! I’ve gone through these forums and all the docs but I just can’t get this to work. Here’s the scenario. I have a table containing most of the data. I also have a many-to-many table for the airports. In the update form I have a Checkbox Group which is populated from a query of all the airports in the airports table. My Server Action has the main query and also a query for the airports. I’ve followed all the docs and thought I had it working but it’s actually only ticki…

[Hyperbytes]

You seem to have made this much more complex than needed. Let me assume you values are 0 /1

1. Simply add the value you want to send when checked as a static value in properties. I.e 1

2. In dynamic attributes set “checked” to the condition you want for the box to be set from the repeat.
   I.e. myvalue==1

3. In your update API action add default(0) to the update statement I.e. myvalue.default(0). This will reset it on update when not checked.

No need to load check/unchecked API actiion

There is no need to set the checkbox to have a “value”, just set checked on condition.

[daves88]

@Hyperbytes

myvalue.default(0)

Thanks for both responses!

So here is what I am trying to achieve. I run a server connect action that searches “mymodules”. If a name exists in this query that matches the value of the checkbox, then make the checkbox checked. If it doesn’t exist, then uncheck.

Is there a simple way this can work?

This is what I have in my “checked” condition… but it only checks the first box

[Hyperbytes]

What is your data structure for the tables?

[daves88]

Config is a DB table, and ‘mymodules’ is a subtable of Config. See below.

I have this in my “checked” condition, but only the first checkbox is checked.

searchmymodules.data.query[$index].moduleName==moduleName

[Hyperbytes]

Still not fully understanding you.

Do you have another table containing all the possible values mymodules may contain?

[daves88]

Apologies- yes I am doing an api call from another app that is populating the checkbox values to be dynamic.

[Hyperbytes]

That complicates things!
I was going to suggest a right join to the options in your subquery to return an array of all options with those selected checked but that puts and end to that idea

[daves88]

mmm I thought so! So the idea is that my other app has a list of modules (moduleName), and this app searches these available modules, then populates the checkbox. When I click a checkbox, it adds that value to the database as an available module).

Should be simple this though… it’s really just checking if a particular module exists in my db (via moduleName), and if it matches the checkbox value (which means it exists in the db) then have it checked. If it doesn’t exist in db then uncheck.

[Hyperbytes]

I am 11000 miles away from my office but there is probably a way to do this with server connect data management by manipulating arrays but without access the wappler I can’t really assist more, sorry

[daves88]

No problem! Im sure the solution is staring at me in the face! Ill keep chipping away

[famousmag]

So you have a query that returns [1, null, 1, 1, 1, null, null, 1]?
(Where 1=exists and null=not exist)

Something like that?

if yes, you just set a condition in your checkbox value that checks if the value coming from the query is 1 or null and if it is null set it to 0. Something like that:
query.value==1?1 :0

I have understood that you need to show the values to your page… Not updating in your server action…
If you talk about updating please let us know.

[daves88]

hmm… so the way it currently works is simple:

1. Query returns multiple “moduleNames”, which dynamically populates my checkbox names
2. When I click on a checkbox, I have a SC action that saves the name of that module in the DB.
3. This is where I am stuck - I need the checkbox to be ticked/checked on page load if that value exists in the database and it matches the corresponding checkbox name. Where I am stuck is because the DB query is for multiple records, it gives me the following: searchmymodules.data.query[0].moduleName which allows my first checkbox to be ticked. I tried replacing [0] with [$index] but still no luck

[famousmag]

Can you please share your page and what actually happens in order to understand?
A screenshot would be enough think (if not a small video…)

[daves88]

Okay so I finally figured this out.

Im sure there is a better way of doing this, but this is what I did in case anyone has the same problem:

1. Create an array server side (using repeat)
2. Flatten your collection
3. Set it to a value

On the front end - create an array using the flattened list.

Create a “checked” condition on the check, in my case it was: mymodulesarray.items.contains(value)

So what this does is it searches my flattened list of “module names” and if the list contains the value of the checkbox item, the make it checked.

Phew, there should be an easier way to do this, but there it is.

Thanks everyone for your help!