Bug in New script.bundle.js Breaks Stepper Submit Functionality
Bug in New script.bundle.js Breaks Stepper Submit
Hi Metronic Team,
The stepper’s submit button (
data-kt-stepper-action="submit") in the latest script.bundle.js (Metronic v8.3.1, Demo 1, Gulp) doesn’t trigger form submission. No POST request is sent, and no console errors appear.Issue: The new
script.bundle.js unconditionally applies e.preventDefault():the.submitListener = function (e) {
e.preventDefault();
KTEventHandler.trigger(the.element, "kt.stepper.submit", the);
};The old version checked for
data-kt-stepper-submit="true":if (the.element.getAttribute("data-kt-stepper-submit") === "true") {
the.submitListener = function(e) {
e.preventDefault();
KTEventHandler.trigger(the.element, "kt.stepper.submit", the);
};
}Workaround:
stepper.on("kt.stepper.submit", function (stepper) {
document.querySelector("#myFormId").submit();
});- Is this a known bug?
- Please fix the stepper to submit forms correctly.
- Update stepper docs if needed.
Details:
- Tested with basic stepper example.
- Reverting to old
script.bundle.jsworks.
Thanks,<br>
Replies (4)
Hi
The issue is that the current KTUI stepper component only handles basic navigation (next/back) and completely lacks submit button support. Here's how to fix this:
Immediate Workaround (Recommended):
// Listen for stepper submit events and manually submit the form
const stepper = document.querySelector("[data-kt-stepper]");
stepper.addEventListener("kt.stepper.submit", function(event) {
const form = document.querySelector("#yourFormId");
if (form) {
form.submit();
}
});Alternative Workaround:
Remove data-kt-stepper-action="submit" from your submit button and use a regular form submit button instead.
The current KTUI stepper implementation only looks for [data-kt-stepper-next] and [data-kt-stepper-back] elements but doesn't handle submit buttons. The old Metronic v8 stepper had proper submit handling that triggered kt.stepper.submit events.
For a permanent fix, this requires updating the KTUI stepper component. We will consider adding it.
Thanks
Hi,
Noted, we will double check it. May I know which Metronic version 8.x are you using ?
Regards,
Sean
ReUI
Open-source React components, blocks and templates built on shadcn/ui and Tailwind CSS by Keenthemes.
