Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: stepper data validator gets called twice ..

nskalis free asked 4 years ago


given the html below

AsPathGroupIx helps you rollout a configlet about multiple as-path regexp

    <div id="divinputAsPathGroupIx" name="divinputAsPathGroupIx">
        <form name="inputAsPathGroupIx" class="inputAsPathGroupIx">
            <div class="row">

                <div class="col-12">
                    <select name="unit" class="mdb-select md-form colorful-select dropdown-primary">
                        <option value="" disabled selected>unit</option>
                        <option value="attributes" data-secondary-text="">attributes</option>
                    </select>
                    <label class="mdb-main-label">unit</label>
                </div>

                <div class="col-12">
                    <select name="spec" class="mdb-select md-form colorful-select dropdown-primary">
                        <option value="" disabled selected>spec</option>
                        <option value="replace" data-secondary-text="">replace</option>
                        <option value="delete" data-secondary-text="">delete</option>
                    </select>
                    <label class="mdb-main-label">spec</label>
                </div>

                <div class="col-12">
                    <select name="groups" class="mdb-select md-form colorful-select dropdown-primary" multiple>
                        <option value="" disabled selected>groups</option>
                        <option value="BOGON_ASNS_IN">BOGON_ASNS_IN</option>
                        <option value="BOGON_ASNS_OUT">BOGON_ASNS_OUT</option>
                    </select>
                    <label class="mdb-main-label">groups</label>
                </div>

            </div>
            <br><br><br>
        </form>

        <div class="step-actions">
            <button class="waves-effect waves-dark btn btn-sm btn-block btn-primary next-step" data-validator="validateAsPathGroupIx" data-feedback="triggerActions"><i class="fas fa-rocket left"></i>APPROVE</button>
        </div>

    </div>

</div>

when clicking on the button APPROVE the fnuction gets called twice

function validateAsPathGroupIx() {
    console.log(document.forms['inputAsPathGroupIx']);
    return true;
}

enter image description here

Can you advise on what is going wrong ?


Grzegorz Bujański staff commented 4 years ago

Hi. Create please snippet here: https://mdbootstrap.com/snippets. I will look at this. Best, Grzegorz


nskalis free commented 4 years ago

ok, I added the stepper related html, but the form doesn't appear correctly on the snippet editor.. (everything is black and the drop down list doesn't work), this is the whole html though: https://mdbootstrap.com/snippets/jquery/nskalis/1791214 can you please advise if that is sth you can work with ?


Grzegorz Bujański staff commented 4 years ago

You need initialize materialSelect and then the form should appear correctly. Unfortunately your snippet doesn't work. After i click validate nothing happened


nskalis free commented 4 years ago

I am sorry can you provide an example with select using your snippet editor ??? clearly the problem is with the editor itself, it doesn't recognise jQuery. I initialised also the stepper, if you copy/paste the snippet locally and call WOW.init() it will work.. I would appreciate an non-24h delay in such simple questions


Grzegorz Bujański staff commented 4 years ago

When I run your code locally still nothing happened after click validate. Can you send working demo to my mail? g.bujanski@mdbootstrap.com


nskalis free commented 4 years ago

thank you! sent.


Grzegorz Bujański staff commented 4 years ago

It's took me a while, but I finded a reason of this issue. Here is the problem: data-validator="validateAsPathGroupIx" data-feedback="triggerActions" . When you click approve button $('#stepper-navigation').nextStep() calls again validateAsPathGroupIx(). I will add a task for my team and we are find the reason for this behavior and fix this.


nskalis free commented 4 years ago

thank you! should it be expected in the next release (and when is that expected) ? together with https://mdbootstrap.com/support/jquery/how-to-append-an-existing-form-with-select-form-fields/ really prohibit the use of the stepper component ?


Grzegorz Bujański staff commented 4 years ago

Hard to say when this issue will be fixed. We will try to solve it asap. But this problem: https://mdbootstrap.com/support/jquery/how-to-append-an-existing-form-with-select-form-fields/ has been resolved in 4.14.0.


nskalis free commented 4 years ago

great! that was more important :)


nskalis free answered 4 years ago


hi,

would you be so kind to provide an update about when the issue of calling twice the data-validator function ?

Here is the problem: data-validator="validateAsPathGroupIx" data-feedback="triggerActions" . When you click approve button $('#stepper-navigation').nextStep() calls again validateAsPathGroupIx(). I will add a task for my team and we are find the reason for this behavior and fix this.


Grzegorz Bujański staff commented 4 years ago

Hard to say. We have planned tasks for the near future. We will try to solve this problem in the meantime. But I am not able to indicate at the moment the specific or approximate date to resolve this issue.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.12.0
  • Device: all
  • Browser: all
  • OS: all
  • Provided sample code: Yes
  • Provided link: No