I have the following script which use to work perfectly fine.
<div id="inspectionList" class="row m-0 p-0" v-if="app.getOption('InspectionChecklists')">
<div v-for="(checklist, index) in (JSON.parse(app.getOption('InspectionChecklists')))[app.store.AddAsset_Module][1]">
<div class="col-12 m-2 p-1 mb-2" v-for="(inspection, index) in checklist">
<input
type="checkbox"
v-bind:name="index"
v-bind:class="'form-check-input'"
v-bind:id="index"
v-bind:value="index"
v-model="app.store.AddAsset_Type_inspections"
style="height:30px; width:30px; accent-color: #5873fe;">
<label v-bind:for="index" style="position:relative; top:-5px">{{inspection.n}}</label>
</div>
</div>
</div>
<div id="debugInfo" v-if="app.store.debug">
Debug: {{ app.store.debug }}
<span>Checked names: {{ app.store.AddAsset_Type_inspections }}</span>
</div>
The script generates a list of checkboxes, and automatically checks any of them that are in the array store in app.store.AddAsset_Type_inspections
app.store.AddAsset_Type_inspections has the following data for example:
Checked names: [
259,
9,
68,
45,
41,
264,
55,
13,
262,
271,
270,
1,
23,
260,
3,
44,
63,
24,
56,
261,
19,
30,
18,
31,
17,
2,
14,
29,
46,
36,
26,
8,
25,
33,
35,
28,
282,
52,
50,
51,
49,
53
]
For some reason, after updating VueJS core library to 3.4.27, the checkboxes automatically check as needed – however users cant manually check or uncheck any of the check boxes.
Things i’ve tried:
-
I added a standard <input type="checkbox" name="test"> checkbox, and it is possible to check and uncheck this without an issue.
-
If I remove v-model="app.store.AddAsset_Type_inspections" so that checkboxes don’t automatically get checked, then it’s possible for a user to check and uncheck any of the boxes without an issue.
-
I’ve looked for any console errors, and no errors are generated
Heres a screenshot of the checkboxes which shows the auto-checked ones, and additionally, the highlight after clicking a checkbox that shows the checkbox isn’t disabled.
