Validazione forum con jquery.validate

Discussione in 'jQuery' iniziata da MarcoGrazia, 28 Novembre 2017.

  1. MarcoGrazia

    MarcoGrazia Utente Attivo

    Registrato:
    15 Dicembre 2009
    Messaggi:
    664
    Mi Piace Ricevuti:
    7
    Punteggio:
    18
    Sesso:
    Maschio
    Occupazione:
    Sviluppare web design (Studiare)
    Località:
    Udine
    Home Page:
    Ciao, ho bisogno di aiuto per una libreria che non sta più funzionando.
    La libreria è la validate() che funziona con jquery e permette in modo semplice e facile di validare un form... in teoria!
    Anzi, anche in pratica ma non questa volta.
    In pratica ho costruito un pagina dove un amministratore di sistema può aggiungere un utente, e tramite un semplice form inserirne i dati, solitamente account ( e qui tramite jquery UI avviene un controllo sul nome inserito, per evitare di inserirlo due volte ) nome, cognome e infine la password ( da ripetere due volte per non sbagliare ).
    In pratica la validazione non avviene, ma viene sempre lanciato il form ( metodo post ) con i dati inseriti fino a quel momento, senza considerare minimamente la validazione.
    Un po' di codice, poco perché il file originale consta per ora, di soli 17 KB, più js esterni e css, va be che si trova in una intranet :D
    Ultima condizione, uso il framework Bootstrap, per non farmi mancare nulla.
    Dunque: HTML.
    Codice:
    <!-- Dati utente -->
                            <h3 id="dati-riportati">Dati riportati</h3>
                            <div class="form-group">
                                <label for="account" class="col-sm-2 control-label">Account</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" id="account" name="account" placeholder="nome.cognome" value="<?php echo $input['account']; ?>" aria-describedby="helpBlock-Account">
                                    <span id="helpBlock-Account" class="help-block">Inserisci un nuovo account nella forma richiesta.</span>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="titolo" class="col-sm-2 control-label">Nome e cognome</label>
                                <div class="col-sm-10">
                                    <div class="row">
                                        <div class="col-sm-2">
                                            <input type="text" class="form-control" id="titolo" name="titolo" placeholder="Signor, Signora ... Dottor, Dottoressa" value="<?php echo $input['titolo']; ?>">
                                        </div>
                                        <div class="col-sm-5">
                                            <input type="text" class="form-control" id="nome" name="nome" placeholder="Mario" value="<?php echo $input['nome']; ?>">
                                        </div>
                                        <div class="col-sm-5">
                                            <input type="text" class="form-control" id="cognome" name="cognome" placeholder="Rossi" value="<?php echo $input['cognome']; ?>">
                                        </div>
                                    </div>
                                </div>
                            </div>
    
                            
    <!-- Password -->
                            <div class="form-group">
                                <label for="password" class="col-sm-2 control-label">Inserisci la password</label>
                                <div class="well col-sm-10">
                                    <div class="row">
                                        <div class="col-sm-6">
                                            <div class="input-group">
                                                <input type="text" class="form-control" id="password1" name="password1" value="">
                                                <span class="input-group-btn">
                                                    <button class="btn btn-success" id="generatore" type="button"><span class="fa fa-cog" aria-hidden="true"></span> Genera</button>
                                                </span>
                                            </div>
                                            <span class="helpBlock-P1">Inserisci una password.</span>
                                        </div>
                                        <div class="col-sm-6">
                                            <input type="text" class="form-control" id="password2" name="password2" value="">
                                            <div class="helpBlock-P2">Ripeti la password.</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                           
                            <div class="form-group">
                                <div class="col-sm-offset-2 col-sm-10">
                                    <button type="submit" class="btn btn-success btn-block" name="add" value="aggiungi">
                                        <span class="fa fa-user-plus" aria-hidden="true"></span> AGGIUNGI</span>
                                    </button>
                                </div>
                            </div>
    
    Quindi il javascript che prosegue sotto l'HTML.
    Codice:
    $( document ).ready( function() {
                    $( '#account' ).autocomplete({
                        source: 'suggestionAdmin-Nomi.get.php',
                        minLength: 3,
                        autoFill: true,
                        max:30,
                        formatItem: function ( row ) {    return row[0] + " (" + row[2] + ", " + row[1] + ")" + " "+row[5];    },
                        formatMatch: function ( row ) {    return row[0];    },
                        formatResult: function ( row ) {    return row[0];    }
                    });
                    $('#account').focus();
                   
                   
                    jQuery.validator.addMethod("valueNotEquals", function(value, element, arg){
                        return arg !== value;
                    }, "Le due password devono necessariamente essere uguali.");
                   
                    jQuery.validator.addMethod("username_rule", function(value, element) {   
                        return this.optional(element) || /^[a-z \.]{2,50}$/i.test(value);   
                    }, "Inserisci solo lettere da a alla z e spazi.");
                   
                    $('form').validate(
                    {
                        rules:
                        {
                            account:
                            {
                                required: true,
                                username_rule: true
                            },
                            nome: {
                                required: true,
                                minlength: 2,
                                username_rule: true
                            },
                            cognome: {
                                minlength: 2,
                                username_rule: true
                            },
                            anno: {
                                valueNotEquals: '-1'
                            },
                            password1: {
                                minlength: 5,
                                required: true
                            },
                            password2: {
                                required: true,
                                equalTo: '#password1'
                            }
                        },
                        highlight: function (element) {
                            $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
                        },
                        unhighlight: function (element) {
                            $(element).closest('.form-group').removeClass('has-error').addClass('has-success');
                        },
                        submitHandler: function(form) {
                            var h = '<input type="hidden" name="h1" value="' + hex_sha512($('#password1').val()) + '">';
                                h += '<input type="hidden" name="h2" value="' + hex_sha512($('#password2').val()) + '">';
                            $('#helpBlock-P2').append(h);
                            h = null;
                            $('#password1').val('Yahoo!');
                            $('#password2').val('Google');
                            form.submit();
                        }
                    });
    
    Ora, così com'è qualunque cosa inserisca nel form , mi viene sempre rimandato un POST coni seguenti dati:
    Cioè non vengono inseriti i dati del form, ma viene creato un "search" che francamente mi manca nei dati inviati ( ho fatta la ricerca in tutto il listato, ma non esiste quella parola in tutto il file ) e il resto scompare, tra l'altro senza validare nulla.
    Se elimino l'oggetto submitHandler() il form viene inviato con i dati giusti, o meglio quelli inseriti ma senza validazione.
    Non ci sto capendo una cippa :D se ci riuscite, mi date una mano?
     
  2. MarcoGrazia

    MarcoGrazia Utente Attivo

    Registrato:
    15 Dicembre 2009
    Messaggi:
    664
    Mi Piace Ricevuti:
    7
    Punteggio:
    18
    Sesso:
    Maschio
    Occupazione:
    Sviluppare web design (Studiare)
    Località:
    Udine
    Home Page:
    Risolto :mad:
    In pratica $(nome).validate(){}); dove nome non può essere l'elemento, ma un identificativo univoco, ovvero form non va bene anche se è l'unico form nella pagina, ma deve essere necessariamente un ID.

    due giorni di lavoro persi :(
     
  3. MarcoGrazia

    MarcoGrazia Utente Attivo

    Registrato:
    15 Dicembre 2009
    Messaggi:
    664
    Mi Piace Ricevuti:
    7
    Punteggio:
    18
    Sesso:
    Maschio
    Occupazione:
    Sviluppare web design (Studiare)
    Località:
    Udine
    Home Page:
    Trovata questa espressione regolare e funziona
    ^(\+{0,1}[0-9]{2,3}|[0-9]{3,5})[-\/ ]?[0-9]{2,4}[-\/ ]?[0-9]{5,8}$
    Permette di validare sia numeri di cellulare che fissi, nelle forme
    +39 123 456789
    +39123456789
    123456789
    +39-123-456789
    +39 123 456789
    Per ora mi va bene :)
    Ah per valutare una regex io uso questo tool online: https://regex101.com/ se vi interessa, fateci un giro.
     
Sto caricando...

Condividi questa Pagina