I have created a multistep form with inputs consisting of both fields and radio buttons. When connecting all the data, I have connected all input buttons and fields to the relevant categories within the dataset. The permissions are correctly set and the mode is on write-only.
However, no matter what I do or change, the data doesn't get submitted at all. I personally think it's something to do with the code but as this is my first time coding ever, I have no idea. I'd appreciate any help!
Link to website: https://thanjimuddin.wixsite.com/m-a-a/book-consultation
Code Snippet:
//SUBMIT BUTTON $w.onReady(function () { $w("#submitButton1").onClick(() => { $w('#bookingMultiStateBox').changeState("bookingCTA"); $w("#submitButton1").label = "Please wait..." $w("#submitButton1").disable(); }); //AFTER SAVE $w.onReady(function () { $w("#dataset1").onAfterSave(function () { $w("#submitButton1").label = "Submit"; $w("#submitButton1").enable(); $w("#bookingMultiStateBox").changeState("bookingCTA"); $w("#anchor1").scrollTo(); }); }); //ON ERROR $w.onReady(function () { $w("#dataset1").onError(function () { $w("#submitButton1").label = "Submit"; $w("#submitButton1").enable(); }); }); });
Everything else works fine, it's just the submit button. When I click it, it does not submit any data to my content manager and also does not go to the next step on after save. Please bear in mind, I created a simple one step form on another page and that seems to work fine, but this multi-step form with radio buttons doesn't work.
Maybe if I share more code, it might help? This isn't all of it but below is how it begins, do you think it might have to do with import local from wix storage?
import {local} from 'wix-storage'; //RADIO BUTTONS $w.onReady(function () { $w("#radioGroup1").onChange(()=>{ let selectedIndex = $w("#radioGroup1").selectedIndex console.log(selectedIndex) if (selectedIndex===0) {function1();} if (selectedIndex===1) {function2();} }); }); function function1(){$w('#bookingMultiStateBox').changeState("acquireDetails2")} function function2(){$w('#bookingMultiStateBox').changeState("enquiryForm")} $w.onReady(function () { $w("#radioGroup2").onChange(()=>{ let selectedIndex = $w("#radioGroup2").selectedIndex console.log(selectedIndex) if (selectedIndex===0) {function3();} if (selectedIndex===1) {function4();} }); }); function function3(){$w('#bookingMultiStateBox').changeState("propertyPurchase1")} function function4(){$w('#bookingMultiStateBox').changeState("remortgageOptions1")} / //DATA VALIDATION $w.onReady(function () { $w("#bookingFirstName, #bookingLastName, #bookingPhoneNumber, #bookingEmail").onChange(function () { if ($w("#bookingFirstName").value.length > 0 && $w("#bookingLastName").value.length > 0 && $w("#bookingPhoneNumber").value.length > 0 && $w("#bookingEmail").value.length > 0) { $w("#submitButton1").enable(); } else { $w("#submitButton1").disable(); } }); });
//SUBMIT BUTTON $w.onReady(function () { $w("#dataset1").onReady(function () { $w("#submitButton1").onClick(() => { $w('#bookingMultiStateBox').changeState("bookingCTA"); $w("#submitButton1").label = "Please wait..." $w("#submitButton1").disable(); }); $w("#dataset1").onAfterSave(function () { $w("#submitButton1").label = "Submit"; $w("#submitButton1").enable(); $w("#bookingMultiStateBox").changeState("bookingCTA"); $w("#anchor1").scrollTo(); }); $w("#dataset1").onError(()=> { $w("#submitButton1").label = "Submit"; $w("#submitButton1").enable(); }); }); });
Now it still depends, if you are doing it only by code, or if you also using the PROPERTY-PANEL.
Your SUBMIT-BUTTON is connected with the dataset, or by CODE only ?
1) If by code only ---> setFieldValues() + save() missing
https://www.wix.com/velo/reference/wix-dataset/dataset/setfieldvalues
2) If using PROPERTY-PANEL-CONNECTION --> onAfterSave() will be activated.