Wappler Version : 7b18
Operating System :
Server Model: node
Database Type:
Hosting Type:
Expected behavior
When using a dropzone element within a Form repeat, I should be able to delete an item from the repeat, and still be able to submit the form.
Actual behavior
An error is received:
dmxAppConnect.js:9 Error calling method in expression: if_sales_page.form_upsert_sales_page.submit() TypeError: Cannot read properties of undefined (reading 'map')
at HTMLDivElement.get (dmxDropzone.js:7:1735)
at dmx.validate (dmxValidator.js:7:1600)
at dmx.validate (dmxValidator.js:7:1127)
at s._validate (dmxAppConnect.js:9:34166)
at s._submit (dmxAppConnect.js:9:33966)
at s.submit (dmxAppConnect.js:9:33243)
at Object.keys.forEach.data.<computed> (dmxAppConnect.js:9:21289)
at dmxAppConnect.js:9:14166
at dmxAppConnect.js:9:11407
at dmx.parse (dmxAppConnect.js:9:11491)
I believe this is a leftover AC2 item that I never caught as it was working for years before.
How to reproduce
The page loads, and the form-repeat has existing items and loads them correctly. If I do not remove any of the items, no error is generated. When the btn_delete_included
is clicked, the repeat properly deletes the item and all its children, including the dropzone component file_feature
.
When the form is submitted, the error is generated.
If relevant, the form is in a conditional region.
I've trimmed down the form repeat in question, to narrow the focus to the repeat and the dropzone component.
<div is="dmx-form-repeat" id="features" dmx-bind:items="get_sales_page_settings.data.sales_page.features">
...
<div class="row">
<div class="col">
<div class="d-flex">
<div class="d-flex " id="feature_inputs" dmx-class:order-3="$index%2==0">
...
<button id="btn_delete_included" class="btn btn-primary" style="width: 105px;" dmx-on:click="run([{condition:{outputType:'boolean',if:`hidden_sales_page_feature_id.value`,then:{steps:{run:{outputType:'text',action:`array_sales_page_feature_ids_to_delete.addUniq(hidden_sales_page_feature_id.value)`}}}}},{run:{outputType:'text',action:`features.remove($index)`}}])">
Delete</button>
</div>
<div class="d-flex" >
...
<input is="dmx-dropzone" id="file_feature" type="file" name="file_feature" message="" accept=".png, .jpg, .jpeg" thumbs="false" style="z-index: 2;" dmx-on:click="feature_image_deleted.uncheck()">
</div>
...
</div>
</div>
</div>
</div>