未定義変数Ajax経由で送信する場合

Question

私はfornフィールド値をajxスクリプトに渡すフォームを用意しています。このスクリプトはこれらの値をPHPに渡し、電子メールアドレスに送信します。

私が持っている問題は、値が表示されず、代わりに単語が定義されていないということです。

ここに私のajaxコードがあります。ここで

$(document).ready(function(){ 
$('form.save').submit(function() { 
var name = $(this).find('.name').attr('value'); 
var email = $(this).find('.email').attr('value'); 
var telephone = $(this).find('.telephone').attr('value'); 
// ... 
    $.ajax({ 
     type: "POST", 
     url: "application.php", 
     data: "name="+ name +"& email="+ email +"& telephone="+ telephone, 
     success: function(){ 
      $('form.save').hide(function(){$('div.success')}); 
     } 
    }); 
return false; 
}); 
}); 

私のフォームは

<form action="" method="post" class="save"> 

           <input type="text" name="name" id="name" clsss="name" value="" placeholder="Name"/> 

           <input type="text" name="email" class="email" value="" placeholder="Email"/> 


           <input type="text" name="telephone" class="telephone" value=""placeholder="Telephone"/> 

          <input name="certified" type="checkbox" value="" checked>I am a Certified sophisticated Investor 
          <input type="hidden" name="type" value="Certified sophisticated Investor"> 
          <input type="submit" name="submit" class="button" value="Submit"/> 

          </div> 
         </form> 

そしてPHP（PHPコードには衛生はありません私はちょうど値を取得しようとしていますし、その後、より良いPHPのコードを使用します）

です

$name = $_POST['name']; 
$email = $_POST['email']; 
$telephone = $_POST['telephone']; 


// mail 
$msg = "$name $email $telephone"; 
$msg = wordwrap($msg,70); 
mail("*************","Application",$msg); 

Answer 1

あなたのコードで間違ったいくつかの事がありますが、

• あなたは間違った方法で、入力フィールドの値を取得している、ここで

  <input type="text" name="name" id="name" clsss="name" value="" placeholder="Name"/> 
                ^It should be class 
  

• をこの文を参照してください。だからあなたのAJAX要求は、このようにする必要があり

  var name = $(this).find('.name').val(); 
  var email = $(this).find('.email').val(); 
  var telephone = $(this).find('.telephone').val(); 
  

：：次のようにそれをする必要がありますあなたのコードにタイプミスがあり

$(document).ready(function(){ 
    $('form.save').submit(function() { 
    var name = $(this).find('.name').val(); 
    var email = $(this).find('.email').val(); 
    var telephone = $(this).find('.telephone').val(); 
     $.ajax({ 
      type: "POST", 
      url: "application.php", 
      data: {name:name, email:email, telephone:telephone}, 
      success: function(){ 
       $('form.save').hide(function(){$('div.success')}); 
      } 
     }); 
    return false; 
    }); 
}); 

Answer 2

以下のようにアヤックスにデータを送信する：

$.ajax({ 
    ... 
    data : { 'foo' : bar, 'bar' : foo }, 
    ... 
}); 

Answer 3

data: "name="+ name +"& email="+ email +"& telephone="+ telephone 

あなたは、キー/値のペアのオブジェクトを作成することができ、スペース

data: "name="+ name +"&email="+ email +"&telephone="+ telephone 

Answer 4

を削除します。

$.ajax({ 
    ... 
    data : { 'name' : name, 'email' : email , 'telephone' : telephone}, 
    ... 
}); 

Answer 5

はこれを試してみてください：

<form id="order-form"> <!--Try to add id for your form --> 
    <!--your code here--> 
    ... 
    ... 
</form> 

のjQuery：

$(document).ready(function(){ 
     $('form.save').submit(function() { 
     var data = $("#order-form").serialize(); //You should use serialize for send data 
      $.ajax({ 
      url: "/yourUrl", 
      data: data,  
      type: 'GET', 
      dataType: 'html', 
      success: function (result) { 
       $('form.save').hide(function(){$('div.success')}); 
       $("#renderarea").html(result); 
      } 
      }); 
      return false; 
     }); 
    }): 

Answer 6

これを試してください。それは正常に動作します。

$(document).ready(function(){ 
$('form.save').submit(function() { 
var str = $("form.save").serialize(); 


$.ajax({ 
    type: "POST", 
    url: "getajax.php", 
    data: str, 
    success: function(){ 
     $('form.save').hide(function(){$('div.success')}); 
    } 
}); 
return false; 
}); 
});