web-dev-qa-db-fra.com

Arrêtez le formulaire d'envoi sur la page d'option personnalisée "Enregistrer les modifications"

En utilisant l'API Settings de Wordpress, je souhaite essayer d'annuler la soumission des options lorsque la validation/désinfection échoue.

Enregistrement des paramètres:

register_setting( 'mysettingspage', 'custom_options', 'input_validation' );

Ma fonction de validation:

function input_validation( $input ){

settings_errors('custom_options');

$options = get_option( 'custom_options' );

// Create our array for storing the validated options
$output = array();

// Loop through each of the incoming options
foreach( $input as $key => $value ) {

        // Check to see if the current option has a value. If so, process it.
        if( isset( $input[$key] ) ) {

            // Strip all HTML and PHP tags and properly handle quoted strings
            $output[$key] = strip_tags( stripslashes( $input[ $key ] ) );

        } // end if

        //check if its not empty
            if(empty($value)){

                add_settings_error(
                    'custom_options',
                    'Missing value error',
                    __('On or more fields can\'t be empty.', 'custom'),
                    'error'
                );

                return array();
            } 

        } // end if


    } // end foreach

    // Return the array processing any additional functions filtered by this action
    return $output;
}

Le problème est que, même si aucune option n’est sauvegardée, WordPress affichera quand même un message "Paramètres enregistrés" et sauvegardera le tableau vide d’option dans la base de données.

Y a-t-il un moyen de changer ce comportement?

2
Guillermo Teixeira

Comment faire pour que les données form ne puissent pas être sauvegardées en cas d'erreur

En fait, les "Paramètres enregistrés". le message ne pas signifie-t-il nécessairement que les options/valeur de la base de données ont été réellement mises à jour - car si l'ancienne et la nouvelle valeur étaient identiques, cela signifie qu'il n'y avait aucun changement, l'ancienne valeur ne être ré-enregistré ou écrasé dans la base de données. Cependant, vous verrez toujours les "Paramètres enregistrés". message qui indique que le formulaire (données) a été soumis avec succès et traité sans erreur.

Par conséquent, lorsque les données de formulaire contiennent des valeurs vides ou non valides, vous devez renvoyer les anciennes options et non une array vide. Veuillez voir ci-dessous, qui est votre code, mais il a été légèrement modifié pour que vous puissiez comprendre ce que je veux dire:

function input_validation( $input ){

//settings_errors('custom_options'); // <- this should NOT be here..

$options = get_option( 'custom_options' ); // <- here's the OLD VALUE

// Create our array for storing the validated options
$output = array();

// Loop through each of the incoming options
foreach( $input as $key => $value ) {

        ... your code here ...

        //check if its not empty
            if(empty($value)){

                add_settings_error(
                    'custom_options',
                    'Missing value error',
                    __('On or more fields can\'t be empty.', 'custom'),
                    'error'
                );

                //return array(); // <- here don't return empty array
                return $options; // <- instead, return the old value
            } // end if


    } // end foreach

    // Return the array processing any additional functions filtered by this action
    return $output; // <- even if all form data are VALID, this/$output
                    // could still be the same as $options (i.e. there
                    // were no changes made)
}

//settings_errors('custom_options'); // <- this should NOT be here.. - Pourquoi pas?

En effet, la fonction settings_errors() est automatiquement appelée sur votre page d'options personnalisées (à condition qu'elle ait été créée à l'aide de WordPress Paramètres API ). Il n'est donc pas nécessaire d'appeler manuellement la fonction. Ajoutez simplement des erreurs de paramètres et elles ' ll sera affiché automatiquement.

Ceci s'appelle automatiquement après qu'une page de paramètres basée sur l'API de paramètres soit soumis . Des erreurs doivent être ajoutées lors de la fonction de rappel de validation pour un paramètre défini dans register_setting().

- Voir https://developer.wordpress.org/reference/functions/settings_errors/

Comment arrêter le form d'être soumis en cas d'erreur

  1. Si vous souhaitez simplement vous assurer que tous les champs du formulaire sont remplis, ajoutez (l'attribut HTML5 de) required au code HTML du champ. Pour des exemples:

    <input name="custom_options[option_1]" type="text" required>
    <select name="custom_options[option_2]" required></select>
    <textarea name="custom_options[option_3]" required></textarea>
    
  2. Utilisez la validation JavaScript. Voici un exemple très simple: (en utilisant jQuery)

    <form method="post" action="options.php" id="my-form">
      <input name="custom_options[option_1]" type="text" id="option-1">
      <select name="custom_options[option_2]" id="option-2">
        <option value="">Select</option>
        <option value="1">One</option>
      </select>
      <textarea name="custom_options[option_3]" id="option-3"></textarea>
      <input type="submit">
    </form>
    
    <script>
    $('#my-form').on('submit', function(){
      if ( // check if all fields are filled
        $('#option-1', this).val().length < 1 ||
        $('#option-2', this).val().length < 1 ||
        $('#option-3', this).val().length < 1
      ) {
        alert('Please fill in all fields.');
        return false; // cancels the submit
      }
    });
    </script>
    

Essayez une démo ici .


Donc, fondamentalement, dans la fonction input_validation(), le form a déjà été soumis. Pour éviter cela, vous pouvez utiliser la validation côté client, comme je l’ai mentionné ci-dessus - la validation HTML5 et jQuery.

0
Sally CJ