10

私はいくつかのフォームデータを自分自身に投稿しようとしていますが、成功しません.私のコードは次のとおりです.

<html>
    <title>Post to self</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">

    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('.x-button').live("click", function () {
                $.ajax({
                    type: "POST",
                    url: "self.php",
                    data: $(".aj").serialize(),
                    success: function (data) {
                        alert("Data Loaded:");
                    }
                });
            });
        });
    </script>
    </head>

    <body>

               <?php
              if(isset($_POST['submit']))
              {
             echo $_POST['firstname'];
              }
              ?>
            <form name="input" action="" class="aj" method="post">
                <article>
                    <label>Firstname</label>
                    <input type="text" name="firstname" value="Ed" class="x-input"
                    />
                </article>
                <article>
                    <label>Lastname</label>
                    <input type="text" name="lastname" value="Doe" class="x-input"
                    />
                </article>
                <article>
                    <label>City</label>
                    <input type="text" name="city" value="London" class="x-input"
                    />
                </article>
                <input type="submit" value="Update Options" class="x-button" />
            </form>
    </body>

</html>

プレーンなphpとhtmlで使用<form name="test" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post">すると動作しますが、jqueryで動作させることができません。

4

3 に答える 3

16

あなたは2つのアプローチを完全に混合しています。

<form id="myform" action="" >
  .....
</form>

同じページに ajax リクエストを送信するには、url パラメータを空または削除したままにします

試す

 <script type="text/javascript">
    $(document).ready(function () {
       $('.x-button').live("click", function () {
           $.post({
                  data: $('form#myform').serialize(),
                  success: function (data) {
                     alert("Data Loaded:");
                  }
              });
          });
        });
</script>
于 2012-07-25T19:16:27.023 に答える
3

もちろん、応答テキストにページ全体を含めたくないので、ajax が要求された場合はステートメントが必要です。

    <?php
/* AJAX check  */
if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {

  if(isset($_POST))
  {
        print_r($_POST);
  }

}else{
?>   
<html>
    <title>Post to self</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">

    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('.x-button').live("click", function () {
                $.ajax({
                    type: "POST",
                    url: "self.php",
                    data: $(".aj").serialize(),
                    success: function (data) {
                        alert("Data Loaded:");
                    }
                });
            });
        });
    </script>
    </head>

    <body>
       <form name="input" action="" class="aj" method="post">
                <article>
                    <label>Firstname</label>
                    <input type="text" name="firstname" value="Ed" class="x-input"
                    />
                </article>
                <article>
                    <label>Lastname</label>
                    <input type="text" name="lastname" value="Doe" class="x-input"
                    />
                </article>
                <article>
                    <label>City</label>
                    <input type="text" name="city" value="London" class="x-input"
                    />
                </article>
                <input type="submit" value="Update Options" class="x-button" />
            </form>
    </body>

</html>
<?php }?>
于 2012-07-25T19:23:29.030 に答える
2

return false;フォームが「通常の」方法で送信されないように、インラインjavascript関数の最後に追加します

于 2012-07-25T19:12:13.297 に答える