Validazione dei valori delle Meta Box personalizzate e campi obbligatori

Question

Validazione dei valori delle Meta Box personalizzate e campi obbligatori

12 set 2010, 19:48:27

Visualizzazioni: 20.6K

Voti: 17

Un aspetto che non ho mai visto trattato è il modo migliore per validare che specifici campi dei moduli siano compilati correttamente per le meta box dei tipi di post personalizzati.

Sto cercando di ottenere opinioni di esperti su come validare al meglio i campi personalizzati per qualsiasi metabox che si potrebbe creare. I miei interessi sono:

assicurare che la validazione dei campi avvenga prima che il post sia pubblicato/aggiornato
utilizzare una classe/codice che non entri in conflitto con altri javascript di WordPress
permettere di definire campi specifici come obbligatori mentre altri potrebbero essere opzionali
validare i campi basandosi su regole personalizzabili incluse espressioni regolari per cose come il formato email
controllare la visualizzazione grafica di eventuali errori/avvisi

Grazie in anticipo!

NetConstructor.com

4.41K

campo personalizzato personalizzazione javascript jquery

Tutte le risposte alla domanda

Commenti

Grazie, proverò domani, ma potresti spiegarmi come fare diverse validazioni? Ad esempio validare un indirizzo email corretto, validare che non ci siano più o almeno XX caratteri, che un campo del form sia compilato... cose del genere?

NetConstructor.com

29 set 2010 11:54:24

Inoltre, questa validazione avviene prima che il post sia salvato/aggiornato? In caso contrario, come posso farlo?

NetConstructor.com

29 set 2010 11:55:04

Gli esempi e la documentazione per il plugin jQuery Validation (linkato nella mia risposta) ti mostreranno come fare tutte queste cose. Per impostazione predefinita la validazione avviene all'invio, ma puoi attivarla su blur o su change per qualsiasi elemento del form relativamente ai tuoi campi personalizzati.

danblaker

29 set 2010 20:13:25

Ho implementato questa soluzione e sembra molto promettente, c'è però un problema: cosa devo inserire nel 'submitHandler'? Dopo la validazione con jquery.validate, WordPress non fa nulla (il pulsante di salvataggio rimane nello stato animato). Come faccio a passare il controllo di nuovo a WP?

mike23

11 mag 2011 12:16:15

Se stai cercando solo di riportare il pulsante Pubblica al suo stato normale quando un campo obbligatorio è vuoto (o quando fallisce qualche altra validazione), non dovresti aver bisogno di fare nulla con il submitHandler; basta modificare il codice validate() per cambiare il pulsante quando la validazione fallisce. Questo funziona: jQuery("#post").validate({ invalidHandler: function() { jQuery('#publish').removeClass('button-primary-disabled'); jQuery('#ajax-loading').css('visibility', 'hidden'); } });

danblaker

14 mag 2011 01:14:37

Ho trovato questo approccio per risolvere il problema della validazione dei campi dei metabox utilizzando codice PHP

https://tommcfarlin.com/post-meta-data-error-messages/

Spero che ti possa essere utile (a me ha funzionato in uno scenario simile)

Julio Garcés Teuber

131

9 giu 2016 20:28:48

Commenti

Anche se questo collegamento potrebbe rispondere alla domanda, è meglio includere qui le parti essenziali della risposta e fornire il link come riferimento. Le risposte costituite solo da link possono diventare non valide se la pagina collegata cambia.

Gabriel

9 giu 2016 20:50:58

Il Codice Base Completo per Aggiungere la Validazione jQuery:

Includi lo script di validazione. Assumo che jQuery sia già incluso.

add_action('admin_enqueue_scripts',function($id){
    $validation',$validation_js_url = #percorso del tuo file validation.js;
    wp_register_script( 'validation',$validation_js_url,array(),'',true );
    wp_enqueue_script( 'validation' );
});

Nel file js o tag script:

jQuery(document).ready(function($){
    var form = $("form[name='post']");
    $(form).find("input[type='submit']").click(function(e){
        e.preventDefault();
        $(form).validate();

        if($(form).valid())
        {
            $("#ajax-loading").show();
            $(form).submit();
        }else{
            $("#publish").removeClass().addClass("button-primary");
            $("#ajax-loading").hide();
        }
    });
});

Fatto :)

Ijas Ameenudeen

121

15 mag 2012 20:50:40

Commenti

E sul lato server?

NetConstructor.com

28 giu 2012 09:12:31

Ho utilizzato questo codice, molto utile, ho solo modificato:

$(form).find("input[type='submit']").click(function(e){

In:

$(form).find("#publish").click(function(e){

Perché se hai un altro form dentro il form principale questo fa partire lo script.

E:

$(form).submit();

In:

$(this).submit();

Perché la prima riga salva solo il post come bozza e non puoi più pubblicarlo.

Tutto scritto qui: http://allgraphics.it/blog/2012/10/jquery-validation-sui-campi-di-input-postcustom-post-di-wordpress/

Ricky

21

20 nov 2012 12:46:42

Se vuoi poter validare lato server l'opzione più semplice è utilizzare Advanced Custom Fields per definire i layout dei tuoi campi personalizzati, e poi l'add-on Validated Field per impostare la validazione per ogni campo nell'Admin di WordPress.

doublesharp

515

24 giu 2015 01:47:38

danblaker 417 · Accepted Answer · 2010-09-28T01:13:07Z

Il modo più semplice è aggiungere la validazione Javascript tramite il plugin jQuery Validate. Ecco una guida di base:

Vicino alla tua chiamata add_meta_box, carica il plugin jQuery Validate insieme a un file JS per il tuo script semplice:

add_action('admin_enqueue_scripts', 'add_my_js');   
function add_my_js(){    
  wp_enqueue_script('my_validate', 'percorso/a/jquery.validate.min.js', array('jquery'));
  wp_enqueue_script('my_script_js', 'percorso/a/my_script.js');
}

Poi in my_script.js includi il seguente codice:

jQuery().ready(function() {
    jQuery("#post").validate();
});

Questo abiliterà la validazione sul modulo del post. Poi nella callback di add_meta_box dove definisci i campi personalizzati, aggiungerai una classe "required" per ogni campo che vuoi validare, così:

<input type="text" name="my_custom_text_field" class="required"/>

Tutti i campi con "required" nella loro classe saranno validati quando il post viene salvato/pubblicato/aggiornato. Tutte le altre opzioni di validazione (regole, stili degli errori, ecc.) possono essere impostate nella funzione document.ready in my_script.js; consulta la documentazione di jQuery Validate per tutte le opzioni disponibili.