2

私は現在、Ajax / JSを使用して、ページの更新やボタンのクリックなしでフォームを送信しています。keyup関数をトリガーするためにタイマーを設定しました。1つの入力フィールドでテストして問題なく動作しましたが、他の入力フィールドが追加されたため、PHPによってエコーされた結果は得られません。Firefoxのバグツールで確認しましたが、結果が保存されています。これがJSの問題なのかPHPの問題なのかわかりません。

ユーザーが入力を停止した後、入力フィールドの値を適切にエコーするにはどうすればよいですか？例

JS / AJAX

<script>
$(document).ready(function() {
  var timer = null; 
  var dataString;   
     function submitForm(){
    $.ajax({ type: "POST",
    url: "index.php",
    data: dataString,
    success: function(result){
    $('#special').html('<p>' +  $('#resultval', result).html() + '</p>');}
                                  });
               return false;
             }
          $('#contact_form').on('keyup', function() {
    clearTimeout(timer);
    timer = setTimeout(submitForm, 2000);
    var name = $("#contact_name, #email, #phone, #address, #website").val();
    dataString = 'name='+ name;
             });
             }); 
</script>

HTML/PHPスニペット

<form action="" method="post" enctype="multipart/form-data" id="contact_form" name="form4">
 <div class="row"> 
  <div class="label">Contact Name *</div> <!-- end .label -->
    <div class="input">
      <input type="text" id="contact_name" class="detail" name="contact_name" value="<?php echo isset($_POST['contact_name'])? $_POST['contact_name'] : ''; ?>" /> 
      <div id="special"><span id="resultval"><? echo $_POST['contact_name'];  ?></span></div>
    </div><!-- end .input-->
 </div><!-- end .row -->

 <div class="row"> 
  <div class="label">Email Address *</div> <!-- end .label -->
   <div class="input">
    <input type="text" id="email" class="detail" name="email" value="<?php echo isset($_POST['email'])? $_POST['email'] : ''; ?>" /> 
    <div id="special"><span id="resultval"><? echo $_POST['email'];  ?></span></div>
   </div><!-- end .input-->
 </div><!-- end .row -->
4

1 に答える 1

0

一括割り当てを行うのではなく、データを構築する必要があります。例えば、あなたは現在持っています：

    var name = $("#contact_name, #email, #phone, #address, #website").val();

そのjqueryは、一致する最初の識別子、おそらくid contact_nameを持つ要素で一致する必要があり、それがnameが持つ唯一の値になります。データのいくつかのフォームフィールドを取得したい場合。

実際、データはフォーム経由で郵送されるため、dataString を作成する必要はまったくありません。

JS の書き換え:

$(document).ready(function() {
    var timer = null; 
    var dataString;   
    function submitForm(){
        $.ajax({ type: "POST",
            url: "index.php",
            dataType: 'json',
            success: function(result){
            $('#special').html('<p>' +  $('#resultval', result).html() + '</p>');}
                              });
        return false;
    }
    $('#contact_form').on('keyup', function() {
        clearTimeout(timer);
        timer = setTimeout(submitForm, 2000);
    });
});

index.php で、$_POST 配列のフォーム値にアクセスできます (例: $_POST['contact_name'])。

于 2012-07-19T23:40:20.077 に答える