5

フォームがあります。正常に送信された後、新しいエントリを表示するためのサーバー側のリダイレクトがあります。

問題: 戻るボタンを押した後も、すべての入力に最後の値が入力されたままです (フォームが自動的に再送信されないか、「フォーム送信の確認」プロンプトが表示されません)。これにより、ユーザーは手動で「送信」をもう一度クリックして、重複したエントリを非常に簡単に送信できるようになります。これは避けたいことです。これは古典的な「再投稿」の問題ではないことに注意してください。投稿/リダイレクト/取得パターンを使用しています。

フォームには 20 以上のフィールドがあり、技術的に言えば、2 つの同一のエントリが正当である可能性がありますが、ユーザーが戻るボタンを押したときにフィールドをクリアしたいだけです。

これが私が試したことです:

キャッシュなしヘッダー
header('Cache-Control: must-revalidate, no-store, no-cache, private, max-age=0');
header('Pragma: no-cache');
header('Expires: Sat, 26 Jul 1997 05:00:00 GMT');
No-cache メタ タグの組み合わせ
<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />
JavaScript による送信とリダイレクト
$('form').submit(function(){
    $.post($(this).attr('action'), $(this).serialize(), function(response){
        window.location = response.redirectUrl;
    });
});
フォーム送信後の「リフレッシュ」リダイレクト
header('refresh:0; url=view_entry'); 
セッション データによってトリガーされる更新(ここで少しハックします...)
// psuedo PHP code for the "add" page
if ($_SESSION['submit']) {
    $_SESSION['submit'] = 0;
    redirect(current_url); // Cross fingers and hope this clears the form
}
if ($formValid and $saveEntry) {
    $_SESSION['submit'] = 1;
    redirect(next_url);
}

これはどれも機能せず、戻るボタンを押した後もフィールドにデータが入力されています。最後のオプションは、実際には「フォーム送信の確認」プロンプトをトリガーします。これは私が望んでいるものではありませんが、少なくとも少しは良くなっています。

これはGoogle Chromeにあることに言及する必要があります。それが役立つ場合は、Codeigniter と jQuery を使用できます。成功したエントリが投稿された後、ユーザーが戻るボタンを押した後、フォームフィールドをクリアしたいだけです。以前にこの問題が発生したことを実際に思い出したことはありません。私はすべてアイデアがありません。これを行う正しい方法は何ですか?

4

1 に答える 1

2

迅速で簡単なアプローチは、応答後、リダイレクトの前にフィールドを個別にクリアすることです。

$('form').submit(function(){
    $.post($(this).attr('action'), $(this).serialize(), function(response){
        // HERE, clear the fields like...
        $("#field_id_1").val('');
        $("#field_id_2").val('');
        // THEN do the redirect
        window.location = response.redirectUrl;
    });
});

これは最も包括的な解決策ではないかもしれませんが、とにかくajax呼び出しを使用して送信を行っているため、この方法で実行しない理由はありません。

于 2012-12-12T17:39:14.977 に答える