0

お問い合わせフォームを正しく機能させようとしています。ページの最後にあるhttp://pagina.chalupakoseckerovne.sk/は、お問い合わせフォームです。jquary.validate プラグインを使用した検証は機能しましたが、送信後に更新せずにページにとどまり、送信ボタンの横に「ありがとう」などの短いメッセージを表示する方法がわかりません。ここに私の検証スクリプトがあります

$("#contact-form").validate({
        rules: {
            name: {minlength: 4,required: true},
            email: {required: true,email: true},
            phone: {number: true,required: true},
            pocet: {range: [1, 10],required: true},
            odkedy: {required: true},
            dokedy: {required: true}
        },   
    });
    $('#contact-form').ajaxForm(function() { 
        $("#done").show("slow");
        $('#contact-form').resetForm();
    }); 
    return false;

そして、ここに私のphpがあります：

<?php 
$ToEmail = 'sample@email.com'; 
$EmailSubject = 'Chalupa-rezervacia'; 
$mailheader = "Content-type: text/html; charset=windows-1250"; 
$MESSAGE_BODY = 'Meno: '.$_REQUEST["name"].'<br />
                Email: '.$_REQUEST["email"].'<br />
                Tel. cislo: '.$_REQUEST["phone"].'<br />
                Pocet: '.$_REQUEST["pocet"].'<br />
                Prichod: '.$_REQUEST["odkedy"].'<br />
                Odchod: '.$_REQUEST["dokedy"].'<br />
                Poznamka: '.$_REQUEST["comments"].'<br />'; 
mail($ToEmail, $EmailSubject, $MESSAGE_BODY, $mailheader);
?>

形

<form name="contact-form" id="contact-form" action="rezervacia.php" method="post">

*編集:* Chrome、FF、Opera では正常に動作するようになりましたが、IE では動作しません。IE では、php にリダイレクトするだけです。

4

1 に答える 1

2

検証関数の ajax post 関数を使用して送信ハンドラーを追加する必要があります。このような何かがそれを行う必要があります:

$('#contact-form').validate({
   rules: {
      name: {minlength: 4,required: true},
      email: {required: true,email: true},
      phone: {number: true,required: true},
      pocet: {range: [1, 10],required: true},
      odkedy: {required: true},
      dokedy: {required: true}
   },
   submitHandler: function(form) {
      // some other code
      // maybe disabling submit button
      // post the form data with ajax

      $.ajax({
          url: 'process.php',
          type: 'POST',
          data: form.serialize(),         
          success: function(data) {
              // Show any returned message
              alert('Load was performed: ' + data);
          }
      });

      // Prevent form submission
      return false;
   }
});

ここで jquery.validate プラグイン ドキュメントを参照してください: http://docs.jquery.com/Plugins/Validation また、ここで jQuery ajax ドキュメント: http://api.jquery.com/jQuery.ajax/

- - 編集 - -

以下の Ryleys のコメントに従って、フォームの送信を妨げる に追加return false;しましたsubmitHandler。$.post関数の代わりとして使用できる短縮関数の例を次に示し$.ajaxます。

$.post('process.php', form.serialize(), function(data) {
    // Show any returned message
    alert('Load was performed: ' + data);
});

ここで jQuery $.post ドキュメントを参照してください: http://api.jquery.com/jQuery.post/

于 2012-12-06T19:04:46.650 に答える