Formvalidation


Grunge

Erfahrenes Mitglied
Hallo Leute,

seit mehreren Tagen versuche ich einen Fehler zu fixen und komme einfach nicht auf die Lösung.

Ich versuche ein Registrierungsformular mit diesem Script zu validieren: Bootstrap 3 Contact form with Validation

Das ding hat in der Vergangenheit auch immer funktioniert, nur irgendwie jetzt nicht mehr. (setze ne neue Seite auf)

Als Fehler bekomme ich folgendes:
[Error] RangeError: Maximum call stack size exceeded. toLength (jquery.js:2:486)

TypeError: undefined is not an object (evaluating 'this.options.fields[g].validators') validateFieldElement (bootstrapvalidator.min.js:12:7424)

Das sind die entsprechenden Zeilen zu den Fehlermeldungen:

486 in jQuery.js:
Code:
// Flatten any nested arrays
        return concat.apply( [], ret );

Aus der Validator.js:

Code:
h = this.options.fields[g].validators;

Wenn ihr mehr braucht sagt bescheid.

So habe ich die ganzen Sachen eingebunden:

//footer:
Code:
<!-- JQuery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<!-- Modernizer -->
<script src="js/modernizer.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<!-- formvalidation -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-validator/0.4.5/js/bootstrapvalidator.min.js"></script>
<!-- app -->
<script src="app.bundle.min.js"></script>


<!-- Validation Register -->
<script>
  $(document).ready(function() {
    $('#register').bootstrapValidator({
       
        // To use feedback icons, ensure that you use Bootstrap v3.1.0 or later
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
           email: {
                validators: {
                    notEmpty: {
                        message: 'Please supply your email address'
                    },
                    emailAddress: {
                        message: 'Please supply a valid email address'
                    }
                }
            }
           
            }
        })
        .on('success.form.bv', function(e) {
       
            //$('#success_message').slideDown({ opacity: "show" }, "slow") // Do something ...
                $('#register').data('bootstrapValidator').resetForm();

            // Prevent form submission
            e.preventDefault();

            // Get the form instance
            var $form = $(e.target);

            // Get the BootstrapValidator instance
            var bv = $form.data('bootstrapValidator');

            // Use Ajax to submit form data
            $.post($form.attr('action'), $form.serialize(), function(result) {
                console.log(result);
            }, 'json');
        });
});

</script>


//head:

Code:
<!-- bootstrap 4.3.1 -->
  <link rel="stylesheet" href="css/vendor/bootstrap.min.css">
  <!-- styles -->
  <link rel="stylesheet" href="css/styles.min.css">
 
  <!-- favicon -->
  <link rel="icon" href="img/favicon.ico">
  <!-- Validator -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.0/css/bootstrapValidator.min.css">

ich hoffe ihr könnt mir weiterhelfen!

LG


NACHTRAG: Wenn ich die Funktion zur Validieren lösche, verschwindet der Jquery Fehler....
 
Zuletzt bearbeitet:

ComFreek

Mod | @comfreek
Moderator
Das klingt mir danach, dass du die bootstrapValidator-Funktion falsch benutzt. Hast du mal die Doku aufgeschlafen und deine Argumente 1:1 mit den erwarteten Argumenten verglichen?
 

basti1012

Erfahrenes Mitglied
Es wäre vieleicht gut wenn du eine Beispiel erstellst ( zb codepen ) wo man das nachvollziehen kann.
So kann man das nicht richtig testen.
Würde das auch gerne testen weil mein Googlen das sagt
Dieser Fehler tritt auf, wenn große Arrays mit der Funktion concat () behandelt werden.

Das kann ich aber bei deinen jetzigen Code so nicht sehen.
Deswegen wäre eine Beispiel Seite gut , die genau das macht was du da wirklich vor hast

Einfaches Beispeiel
Erzeugt auch dein Fehler
 

EuroCent

Klappstuhl 2.0
Also bin Ich blind oder sehe Ich es als Einziger dass eine } zu viel im Code ist :D

Sein Code-Ausschnitt:
Javascript:
           email: {
                validators: {
                    notEmpty: {
                        message: 'Please supply your email address'
                    },
                    emailAddress: {
                        message: 'Please supply a valid email address'
                    }
                }
            }
          
            }

Richtig:
Javascript:
           email: {
                validators: {
                    notEmpty: {
                        message: 'Please supply your email address'
                    },
                    emailAddress: {
                        message: 'Please supply a valid email address'
                    }
                }
            }

Oder sehe Ich das völlig Falsch?!

Denn das wäre hier sehr Plausible :)
 

basti1012

Erfahrenes Mitglied
Ich glaube das die } richtig sind
Code:
        fields: {
           email: {
                validators: {
                    notEmpty: {
                        message: 'Please supply your email address'
                    },
                    emailAddress: {
                        message: 'Please supply a valid email address'
                    }
                }
            }
         }
Man könnte auf der schnelle den Js Teil bei jsfiddle reinkopieren, dann erfährt man sofort ob da eine Klammer fehlt und so weiter
 

Grunge

Erfahrenes Mitglied
HI, sorry das war Zuviel Input auf einmal.

Ich verstehe das alles nicht so ganz. Es hat bisher immer funktioniert - deswegen frage ich mich jetzt, wo wie was falsch gelaufen ist.

Ne klammer fehlt da definitiv nicht. jedenfalls gibt jsfiddle keinen Fehler aus

Nochmal: Die Funktion muss schonmal irgendwas mit dem js Fehler zu tun haben, denn wenn ich die Funktion zufällig benenne oder lösche gibt es keinen Fehler. Also sollte man vielleicht da ansetzen, was da das Problem ist?
 

basti1012

Erfahrenes Mitglied
könntest du mal ein komplettes Beispiel erstellen wo man das sehen kann?
Zb link zur deine page oder bei codepen ?
 

Sempervivum

Erfahrenes Mitglied
Ist dies der Validator, den Du benutzt?
Since BootstrapValidator is designed to use with Bootstrap, your form must be structured using Bootstrap classes.

If your form is NOT structured by Bootstrap classes (the element containing field and associated label does NOT have form-group class), you will see the following error in the Console:

// Chrome
Uncaught RangeError: Maximum call stack size exceeded
 

Grunge

Erfahrenes Mitglied
Sempervivum. Das ist zwar nicht der Validator den ich benutze, jedenfalls scheint die JS-Datei komplett anders zu sein, jedoch klingt dein Lösungsvorschlag plausibel!

Denn ich habe es mal nachgeprüft: Das Formular besteht nicht aus einer Bootstrap Klasse. Und die anderen Formulare bei denen ich dieses Script genutzt habe schon.

Außerdem heißt auch meiner, den ich benutze - BootstrapValidator

Manchmal kann das Leben so einfach sein. Danke Semper - da muss ich mir nun nur ne andere Lösung einfallen lassen!
 

Neue Beiträge

Forum-Statistiken

Themen
272.360
Beiträge
1.558.622
Mitglieder
187.832
Neuestes Mitglied
SirrDansen