Checkbox (toggle switch) isn't dynamically checked after form reset

Wappler Version : 2.8.3
Operating System : Mac OS 10.15.4

Expected behavior

What do you think should happen?

Check boxes and toggle switches should be automatically checked if the “checked” condition is met.

Actual behavior

What actually happens?

Upon refresh of the page the checkboxes are dynamically checked. After the form containing the checkbox has been submitted and reset having had a seperate (or none) field updated, the checkbox won’t subsequently be dynamically checked even if the “checked” condition is true.

How to reproduce

  • Detail a step by step guide to reproduce the issue
  • A screenshot or short video indicating the problem
  • A copy of your code would help. Include: JS, HTML.
  • Test your steps on a clean page to see if you still have an issue

To Reproduce.

database
  • Make a database table with one of the fields a “tiny int” status field (ie a 1 or a 0 ), make the other field a normal text varchar.
  • Add one record, with a 1 in the status field and anything in the text field.
Server connect
  • Make a server connect file with a simple query of the table.
  • Make a server connect update file with the status field set to .default(0)
app connect
  • On a fresh page
  • Make a server connect action, referencing the server query.
  • Place a variable on the page, that references the status field in the SC action
  • Make a form on the page using the update server action. run the form generator with the server query action to populate the fields, change the status field from number to checkbox.
  • Set the checkbox to static value of 1, open dynamic attributes, and set checked to (var1.value == 1), this is testing the variable for a 1.
  • Set the form’s success dynamic event to, reload the the SC action, and reset the form.
Form usage
After thoughts
  • If the checkbox form field itself is changed, then upon form reset it will dynamically update in the correct manner.
  • This makes me think that the form trying to update the status field in the database with a 1 when it already contains a 1, throws some kind of error that effects the subsequent dynamic checking of the checkbox.
1 Like

Bump

Hi Tesla, or anyone else looking for the answer to this (including me in a few months when my aging brain has forgotten, here’s how I got it working.

I don’t think it’s an issue with Wappler, as I found the same problem with other bootstrap switches. More of an issue with HTML and the way checkboxes work.

I had to do this in the raw HTML - not sure if there’s a way to do it in the Wappler UI.

<div class="form-group row">

            <label for="inp_enable_social_share" class="col-sm-2 col-form-label">Enable social share</label>

            <div class="col-sm-10">

                <div class="custom-control custom-switch" dmx-on:click="">

                    <input class="custom-control-input" type="checkbox" value="" id="checkbox1" name="checkbox1" dmx-bind:value="checkbox1.checked.then(1, 0)">

                </div>

            </div>

        </div>
1 Like

Can confirm this worked for me. Thanks @BlakeyUK

That’s a 2 years old topic with a Wappler version 2.xx
If you are experiencing some similar issue in the latest Wappler please report it in a separate topic.