web-dev-qa-db-fra.com

Comment arrêter la soumission de formulaire lors de l'actualisation de la page

Bonjour, j’ai un formulaire qui ajoute des pièces jointes à une publication. Toutefois, lorsque le formulaire est affiché, il n’affiche évidemment pas la publication avec la nouvelle pièce jointe indiquant "votre fichier a été téléchargé". Lorsque l'utilisateur actualise la page (pour essayer d'afficher sa nouvelle pièce jointe), le formulaire est à nouveau publié!

Est-il possible soit (1) d'arrêter la publication du formulaire lors de l'actualisation, (2) d'actualiser automatiquement la page pour afficher la publication avec sa nouvelle pièce jointe? (2 c'est bien mieux)

<?php $post_id = $post->ID;
if ( isset( $_POST['html-upload'] ) && !empty( $_FILES ) ) {
require_once(ABSPATH . 'wp-admin/includes/admin.php');
$id = media_handle_upload('async-upload', $post_id); //post id of Client Files page
unset($_FILES);
if ( is_wp_error($id) ) {
    $errors['upload_error'] = $id;
    $id = false;
}

if ($errors) {
    echo "<p>There was an error uploading your file.</p>";
} else {
    echo "<p>Your file has been uploaded.</p>";
}
}

?>
<form id="file-form" enctype="multipart/form-data" action="<?php echo $_SERVER['REQUEST_URI']; ?>" method="POST">

<p id="async-upload-wrap"><label for="async-upload">upload</label>
<input type="file" id="async-upload" name="async-upload"> <input type="submit" value="Upload" name="html-upload"></p>

<p><input type="hidden" name="post_id" id="post_id" value="<?php echo $post_id ?>" />
<?php wp_nonce_field('client-file-upload'); ?>
<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>" /></p>

<p><input type="submit" value="Save all changes" name="save" style="display: none;"></p>
</form>

Merci! :)

5
ameeromar

Au lieu de …

} else {
    echo "<p>Your file has been uploaded.</p>";
}

… Redirige vers une autre adresse en cas de succès:

} else {

    $new_url = add_query_arg( 'success', 1, get_permalink() );
    wp_redirect( $new_url, 303 );
}

Le code d'état 303 déclenche une demande GET :

Cette méthode existe principalement pour permettre à la sortie d'un script activé par le POST de rediriger l'agent utilisateur vers une ressource sélectionnée. Le nouvel URI n'est pas une référence de remplacement pour la ressource demandée à l'origine. La réponse 303 NE DOIT PAS être mise en cache, mais la réponse à la seconde demande (redirigée) peut être mise en cache.

Dans votre gestionnaire de formulaire, vérifiez d'abord si $_GET['success'] est défini et que sa valeur est 1, puis imprimez un message de réussite. Le visiteur peut recharger cette page encore et encore - et rien ne sera envoyé.

6
fuxia

J'ai eu le même problème et c'était "compliqué" par le fait que je redirige toutes les URL vers un seul fichier .php. En fin de compte, tout ce que je devais faire pour le résoudre consistait à insérer le code suivant avant qu'un code HTML ne soit écrit sur la page.

<?php
if (isset($_POST['mypostvar']) && isset($_SERVER['REQUEST_URI']))
{
    [process the post data in 'mypostvar']
    header ('Location: ' . $_SERVER['REQUEST_URI']);
    exit();
}
?>

Cela redirigera vers la même page après le traitement de la postdata comme vous le souhaitez. Après la redirection, les données postales d'origine sont effacées et ne déclencheront pas la nouvelle soumission. La fonction 'header ()' ne fonctionnera que si vous l'insérez avant que quoi que ce soit ne soit écrit sur la page. exit () est nécessaire.

Vous devez traiter les données de publication avant de placer l'en-tête ().

1
Hans Hokke

La meilleure méthode que j'ai trouvée utilise javascript et css. En-tête de méthode de redirection php commun ('Location: http://www.votredomaine.com/url ); Cela fonctionnera mais cela provoquera un avertissement "Avertissement: impossible de modifier les informations d'en-tête - en-têtes déjà envoyés" dans différents frameworks et cms tels que wordpress, drupal, etc. Ma suggestion est donc de suivre le code ci-dessous

echo '<style>body{display:none;}</style>'; 
echo '<script>window.location.href = "http://www.siteurl.com/mysuccesspage";</script>'; 
exit;

La balise de style est importante sinon l'utilisateur peut avoir l'impression que la page est chargée deux fois. Si nous utilisons une balise de style avec body display none, puis que nous actualisons la page, l'expérience de l'utilisateur sera identique à celle de l'en-tête php ('Location: ....);

J'espère que ça va aider :)

0
Ajith

Vous pouvez également tester $_SERVER['REQUEST_METHOD'] === 'POST' pour vous assurer que la page a été actualisée via POST avant de traiter le formulaire.

if ( $_SERVER['REQUEST_METHOD'] === 'POST' )
{
   // Do Stuff
}
0
Jake

un moyen plus simple consiste à supprimer l'action de votre formulaire et à avoir une action cachée, par exemple:

<html>
<form action="" method="post><input type="text" name="name" />
<input type="submit" value="Submit" />
<input type="hidden" name="action" value="Submit" />
</form>
</html>

demandez à votre contrôleur de vérifier la validité et les soumissions afin de vérifier si le formulaire a été soumis:

<?php 
if (isset($_POST['action']) && $_POST['action'] == 'Submit'){
   //you should add code to validate user input here
   //if all ok submit the form
   header('Location: .'); //redirects to the controller without resubmitting
}
?>

cette méthode est très utile pour les scripts dans lesquels vous ajoutez ou supprimez des enregistrements sur une page d'administration, car cela rechargerait la page sans soumettre à nouveau et l'enregistrement supprimé ou ajouté serait soit supprimé, soit ajouté à la page :)

0
timmac15

J'ai résolu ce problème en utilisant l'action template_redirect (soit dans un plugin, soit dans le fichier functions.php de votre themes).

add_action('template_redirect','myfunction') ;

function myfunction() { 
  global $post;
  $post_id = $post->ID;
  if ( isset( $_POST['html-upload'] ) && !empty( $_FILES ) ) {
     require_once(ABSPATH . 'wp-admin/includes/admin.php');
     $id = media_handle_upload('async-upload', $post_id); //post id of Client Files page
     unset($_FILES);
     if ( is_wp_error($id) ) {
        $errors['upload_error'] = $id;
        $id = false;
    }

  }
  $error = ($errors) ? 1 : 0;
  wp_redirect( "/?p={$post_id}?errors={$error}",301);
}

Ensuite, sur votre page, vous pouvez vérifier les erreurs

if ($_GET['errors']) {
    echo "<p>There was an error uploading your file.</p>";
} else {
    echo "<p>Your file has been uploaded.</p>";
}

(Je n'ai pas testé ce code .. il devrait vous donner un bon point de départ).

0
Sunil

L'idée générale est de rediriger l'utilisateur vers d'autres pages après la soumission du formulaire, ce qui empêcherait la resoumission du formulaire lors de l'actualisation de la page, mais si vous devez conserver l'utilisateur sur la même page après la soumission du formulaire, vous pouvez le faire. de multiples façons.

Supprimer les données du formulaire

Une façon d'arrêter la resoumission de page lors de l'actualisation de page consiste à supprimer les données de formulaire après leur soumission afin que la variable stockant les données de formulaire devienne vide et à encapsuler le bloc de codes de traitement de formulaire pour vérifier si le formulaire est vide.

 if (! empty ($ _ POST) && $ _SERVER ['REQUEST_METHOD'] == 'POST') {
 $ data = // code de traitement ici 
 unset $ $; 
} 

Cela rendra $ data vide après le traitement et la première clause arrêtera la nouvelle soumission du formulaire lors de l'actualisation de la page.

Javascript

Cette méthode est assez simple et bloque la fenêtre contextuelle demandant une nouvelle soumission du formulaire lors de l'actualisation une fois le formulaire soumis. Il suffit de placer cette ligne de code javascript au pied de page de votre fichier et de voir la magie.

 <script> 
 if (window.history.replaceState) {
 window.history.replaceState (null, null, window.location.href); 
} 
 </ script> 

Plus sur ces questions, vous pouvez visiter ce lien.

0
Jiwan