0

入力フィールドと選択要素を使用して ajax 接続を行いましたが、本来あるべき結果が得られません。

HTML フォーム コード (name を入力として、iphone を select 要素として)

 <div id="contact_form">
    <form name="contact" method="post" action="">Name
        <input type="text" name="name" id="name" />Iphone
        <select name="iphone" id="iphone">
            <option value="Iphone 4" selected>Iphone 4</option>
            <option value="Iphone 4S">Iphone 4S</option>
            <option value="5">Iphone 5</option>
        </select>
        <input type="submit" name="submit" class="button" id="submit_btn" value="Send"
        />
    </form>
</div>

JS コード

   $(function () {
       $('.error').hide();
       var dataString = 'name=' + name + '&iphone=' + iphone;
       $.ajax({
           type: "POST",
           url: "send.php",
           data: dataString,
           success: function () {
               $('#contact_form').html("<div id='message'></div>");
               $('#message').html("<h2>Contact Form Submitted!</h2>")
                   .append("<p>We will be in touch soon.</p>")
                   .hide()
           }
       });
       return false;
   });

PHP (send.php) コード

<?PHP
$name = $_POST['name'];
$iphone = $_POST['iphone'];

$email="my@mail.com";
$from="anyone@mail.com";

$subject="Contact Email";
$headers = "Content-type: text/html; charset=windows-1256\r\n";
$headers .= "From: $from\r\n";

$mailtext="name : $name - Iphone : $iphone";

mail($email,$subject,$mailtext,$headers);
?>

from を誰の名前でも使用した場合の結果

Name : anyone - Iphone : [object HTMLSelectElement]

[object HTMLSelectElement]これは、 select 要素が機能しておらず、選択した値を渡していないように見えるエラーです

アイデアはありますか？〜ありがとう

4

2 に答える 2

1

私はあなたのコードを少し変更しました.私がしたことは、あなたのフォームに送信ハンドラーを添付し、デフォルトのアクションを防ぎました.ここに重要な部分があります. フォームの内容をシリアル化します。これを試して、これがどのように機能するか教えてください。私は通常、このように ajax 化されたフォームを送信します。それが良い習慣かどうかはわかりませんが、これを試してみてください。

   $(function () {

        $('.error').hide();
        $('form[name=contact]').submit(function(e){
            e.preventDefault();
            var form_data = $(this).serialize();        
            $.ajax({
                type: "POST",
                url: "send.php",
                data: form_data,
                success: function () {
                    $('#contact_form').html("<div id='message'></div>");
                    $('#message').html("<h2>Contact Form Submitted!</h2>")
                        .append("<p>We will be in touch soon.</p>")
                        .hide()
                }
            });
        });
    });
于 2012-12-31T08:54:39.057 に答える
0

次のように iPhone の値を取得していることを確認します。

var iphone = $("#iphone").val();

$.postあなたがしていることに対してよりエレガントになるでしょう...

$.post("send.php", { name: name, iphone: iphone },
   function(data) {
     alert("Data Loaded: " + data);
   });
于 2012-12-30T23:43:09.383 に答える