web-dev-qa-db-fra.com

Validation des valeurs de la boîte à méta personnalisée et des champs obligatoires

Quelque chose que je n'ai jamais vu couvrir est le meilleur moyen de valider que des champs de formulaire spécifiques soient correctement remplis pour les boîtes de méta de type message personnalisé.

Je cherche à obtenir des avis d'experts sur la meilleure façon de valider des champs personnalisés pour les métaboxes que l'on pourrait créer. Mon intérêt est de:

  • s'assurer que la validation sur le terrain a lieu avant que le message soit publié/mis à jour
  • en utilisant une classe/code qui n'entre pas en conflit avec d'autre javascript wordpress
  • vous permet de définir des champs spécifiques selon vos besoins, tandis que d'autres pourraient être facultatifs
  • valider les champs en fonction de règles personnalisables, y compris regex pour des éléments tels que le format de courrier électronique
  • contrôler l'affichage visuel des erreurs/avis

Merci d'avance!

custom-fieldcustomizationjavascriptjquery
15
NetConstructor.com

Le plus simple est d'ajouter une validation Javascript via le plugin jQuery Validate . Voici la procédure la plus élémentaire:

Près de votre appel à add_meta_box, mettez en file d'attente le plug-in jQuery Validate ainsi qu'un fichier JS pour votre script simple:

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

Ensuite, dans my_script.js, incluez ce qui suit:

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

Cela permettra la validation sur le formulaire de publication. Ensuite, dans le rappel add_meta_box où vous définissez les champs personnalisés, vous devez ajouter une classe "obligatoire" pour chaque champ que vous souhaitez valider, comme suit:

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

Tous les champs avec "obligatoire" dans leur classe seront validés lorsque la publication sera enregistrée/publiée/mise à jour. Toutes les autres options de validation (règles, mise en forme des erreurs, etc.) peuvent être définies dans la fonction document.ready dans my_script.js; vérifiez la documentation de validation de jQuery pour toutes les options.

20
danblaker

J'ai utilisé ce code, très utile, Justa a changé:

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

À:

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

Parce que si vous avez un autre formulaire dans le formulaire principal, cela lance le script.

Et:

$(form).submit();

À:

$(this).submit();

Parce que la première ligne enregistre uniquement le message en tant que brouillon et vous ne pouvez plus le publier.

Tout écrit ici: http://allgraphics.it/blog/2012/10/jquery-validation-sui-campi-di-input-postcustom-post-di-wordpress/

2
Ricky

J'ai trouvé cette approche pour résoudre le problème de validation des champs metabox en utilisant le code PHP

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

J'espère que cela vous aide (fonctionne pour moi dans un scénario similaire)

2
Julio Garcés Teuber

Le code de base complet pour ajouter la validation jQuery:

  1. Mettre en file d'attente le script de validation. Je suppose que jQuery est déjà interrogé.

    add_action('admin_enqueue_scripts',function($id){
    $validation',$validation_js_url = #your validation.js source;
    wp_register_script( 'validation',$validation_js_url,array(),'',true );
    wp_enqueue_script( 'validation' );
});

  2. Dans le fichier js ou la balise de 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();
        }
    });
});

  3. Terminé :)

2
Ijas Ameenudeen

Si vous voulez pouvoir valider le côté serveur, l’option la plus simple est d’utiliser Champs personnalisés avancés pour définir la disposition de vos champs personnalisés, puis le Module validé add-on pour définir votre validation par champ dans WordPress Admin.

0
doublesharp