Topic: Stepper - Multiple Input Fields per Step
<!-- Step 1: Account info --> <liclass="step active"> <divclass="step-title waves-effect waves-dark">أولاً: معلومات الحساب</div> <divclass="step-new-content form"> <divclass="md-form pb-4"> <iclass="fa fa-user-tag prefix"></i> <inputtype="text"id="form-register-username"class="form-control validate"required> <labelfor="form-register-username"class="">Username</label> </div> <divclass="md-form pb-4"> <iclass="fa fa-envelope prefix"></i> <inputtype="email"id="form-register-email"class="form-control validate"required> <labelfor="form-register-email"class="">Email</label> </div> <divclass="md-form pb-4"> <iclass="fa fa-lock prefix"></i> <inputtype="password"id="form-register-password"class="form-control validate"required> <labelfor="form-register-password"class="">Password</label> </div> <divclass="md-form pb-4"> <iclass="fa fa-lock prefix"></i> <inputtype="password"id="form-register-password2"class="form-control validate"required> <labelfor="form-register-password2"class="">كرر ال Password</label> </div> <divclass="step-actions d-flex justify-content-center"> <buttonclass="waves-effect waves-dark btn btn-sm btn-primary next-step">Next</button> </div> </div> </li>
BX3 pro answered 6 years ago
elements: function () { var validator = this, rulesCache = {}; // Select all valid inputs inside the form (no submit or reset buttons) return $(this.currentForm) .find("input, select, textarea, [contenteditable]") .not(":submit, :reset, :image, :disabled") .not(this.settings.ignore) .filter(function () { var name = this.name || $(this).attr("name"); // For contenteditable if (!name && validator.settings.debug && window.console) { console.error("%o has no name assigned", this); } // Set form expando on contenteditable if (this.hasAttribute("contenteditable")) { this.form = $(this).closest("form")[0]; this.name = name; } // Select only the first element for each name, and only those with rules specified if (name in rulesCache || !validator.objectLength($(this).rules())) { return false; } rulesCache[name] = true; return true; }); }Which is the function responsible for finding the elements in the form. And as you can see in the filter function, they check each object by name attribute and then put it in a rulesCache object. So if you don't put a name attribute, it will be "undefined" for all your inputs and they will be ignored except the first one ...
Jakub Strebeyko staff answered 6 years ago
Hi there,
BX3 - thanks for taking time to post the solution here.
Ashraf - has it resolved the issue on your end?
Wish you all an awesome week.
With Best Regards,
Kuba
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.5.10
- Device: Laptop
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: Yes
Bartłomiej Malanowski staff pro premium commented 6 years ago
Do you get any console logs?