通过AJAX和PHP使用POST发送数据

时间:2016-10-14 10:51:01

标签: javascript php jquery ajax

我有一个我在AJAX请求中发送的对象:

 function send_value() {
    $.ajax({
        type: 'post',
        url: 'get.php',
        data: {
            source1: "some text",
            source2: "some text 2",
            uniId: 3
        },
        success: function (data) {
            console.log(data);
        }
    });
    return false;
}

我试图点击按钮发布它们

<head>
    <script src="./script.js"></script>
    <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
</head>
<body>
    <form action="get.php" method='post' name='sendform' onSubmit='send_value()'>
        <input type='submit' value='Test1'>
    </form>
</body>

然后我使用PHP打印变量:

<?php
    if (!empty($_POST["uniId"])) 
    {
        if ($_POST["uniId"] == 3) 
        {
            echo 'your logged in as '; 
            echo $_POST['uniId'];

            $src1 = $_POST['source1'];
            $src2 = $_POST['source2'];
            echo $src1;
            echo $src2;
        } 
        else 
        {
            echo 'sorry uniID is not correct';
        }
    } 
    else 
    {
        echo "Im sorry the page was not able to load ";
        var_dump($_POST);
    }

现在uniID3所以我希望看到:

your logged in as 3 some text some text2

但我得到了:

Im sorry the page was not able to load
C:\wamp64\www\mysite\get.php:20:
array (size=0)
empty

我的代码中没有发布变量并在我的PHP中打印出来有什么问题?

由于

3 个答案:

答案 0 :(得分:1)

问题是因为您没有阻止标准表单提交。因此,发送的form元素没有数据,因为它不包含表单控件元素。

要解决此问题,您可以将函数输出返回给事件处理程序:

<form action="get.php" method="post" name="sendform" onsubmit="return send_value()">

然而,很多更好的方法是使用不引人注目的JS附加submit事件并阻止标准表单提交。正如您已经使用jQuery,以下是如何做到这一点:

$(function() {
    $('form').on('submit', function(e) {
        e.preventDefault();
        $.ajax({
            type: 'post',
            url: 'get.php',
            data: {
                source1: "some text",
                source2: "some text 2",
                uniId: 3
            },
            success: function (data) {
                console.log(data);
            }
        });
    });
});
<form action="get.php" method='post' name='sendform'>
    <input type='submit' value='Test1'>
</form>

答案 1 :(得分:0)

请使用此表单代码

<head>

       <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
</head>
<body>
    <form action="get.php" method="post" name="sendform" onsubmit="return send_value();">
        <input type='submit' value='Test1'>
    </form>
</body>
 <script>

 function send_value() {
    $.ajax({
        type: 'post',
        url: '2.php',
        data: {
            source1: "some text",
            source2: "some text 2",
            uniId: 3
        },
        success: function (data) {
            console.log(data);
        }
    });
    return false;
}

</script>

&#34; get.php&#34; FILE

<?php
print_r($_POST);
    if (!empty($_POST["uniId"])) 
    {
        if ($_POST["uniId"] == 3) 
        {
            echo 'your logged in as '; 
            echo $_POST['uniId'];

            $src1 = $_POST['source1'];
            $src2 = $_POST['source2'];
            echo $src1;
            echo $src2;
        } 
        else 
        {
            echo 'sorry uniID is not correct';
        }
    } 
    else 
    {
        echo "Im sorry the page was not able to load ";
        var_dump($_POST);
    }
    ?>

这是主要的事情:

<form action="2.php" method="post" name="sendform" onsubmit="return send_value();">

答案 2 :(得分:0)

您错过了dataType

     function send_value() {
$.ajax({
    type: 'POST',
    url: 'get.php',
    dataType: "json",
    data:({"uniId":"test"}),
    success: function (data) {
        console.log(data);
    }
});
return false;

}

相关问题