2

送信時にページを更新する必要のない単純な ajax リクエストを試しています。しかし、私はそれを間違った方法で行ったと思います。どんな助けでも大歓迎です。

HTML/JS ページ

<script>
    $(function () {
        $('form#person').on('submit', function(e) {
            $.ajax({
                type: 'post',
                url: 'addAPerson.php',
                data: $(this).serialize(),
                success: function (o) {
                          =====>    console.log(o); <=== I TRIED DOING THIS BUT NOTHING IS PRINTED
                    alert('MUST ALERT TO DETERMINE SUCCESS PAGE');
                }
            });
            e.preventDefault();
        });
    });     
</script>

<form id="person" action="addAPerson.php" method="post">
  Firstname: <input name="fname" />
  Lastname: <input name="lname" />
  <input type="reset" style="float:right"name="cancel" value="cancel"/>
  <input type="submit" name="submit" value="save"/>
</form>

addAPerson.php

<?php
  $fname = $_POST['fname'];
  $lname =$_POST['lname'];
  $con = mysql_connect("localhost","root","");
  mysql_select_db("person",$con);
  $sql = "INSERT INTO person(firstname, lastname) VALUES('$fname', '$lname')";

  mysql_close();
?>
4

2 に答える 2

2

ページに複数のフォームがある場合は、次のように変更する必要があります。

$('form').serialize(),

に：

$(this).serialize(),

それ以外の場合は、パラメーター内のすべてのフォームからのフィールドがこのスクリプトに含まれます。

また、PHP が成功したかどうかを示すために何かをエコーすることをお勧めします。これを AJAX 成功関数で表示できます。

また、スクリプトへの入力をサニタイズし、できればパラメータ化されたクエリを使用して、mysql_xxx 関数から mysqli_xxx または PDO に変換する必要があります。

于 2013-08-25T02:14:42.387 に答える
0

以下は、あなたのコードに基づく私のテストです。そこにいくつかの変更があります。まず、jQuery リンクを挿入し、各テキスト ボックスに「type」を追加します。

<html>
<head>
    <script src="./jquery-1.9.1.min.js"></script>
    <script>
        $(function () {
            $('form#person').on('submit', function(e) {
                $.ajax({
                    type: 'post',
                    url: 'test.php',
                    data: $('form').serialize(),
                    success: function () {
                        alert('MUST ALERT TO DETERMINE SUCCESS PAGE');
                    }
                });
                e.preventDefault();
            });
        });     
    </script>
</head>
<body>
<form id="person" method="post">
  Firstname: <input name="fname" type="text" />
  Lastname: <input name="lname" type="text" />
  <input type="reset" style="float:right"name="cancel" value="cancel"/>
  <input type="submit" name="submit" value="save" />
</form>
</body>

これはphpコードです。データベースに書き込む代わりに、単純に文字列をエコーし​​ます。ページを更新せずに「保存」ボタンをクリックすると、アラートが表示されます。

<?php echo "success"; ?>

これがあなたの要件に代わるものです。ダウンロードしてローカルでテスト実行できるソースコードを提供します。

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/

于 2013-08-25T02:36:31.097 に答える