关于javascript：将ajax发布数据发布到php文件


Form ajax post data to php file

本问题已经有最佳答案，请猛点这里访问。

嗨，我试着用Ajax制作表单。但是我在将表单变量发送到PHP文件时遇到了一些问题。我得到错误：未定义的索引：名称。我检查chrome dev工具，发现变量正在发送。但是当echo json_编码时，我在php文件中看到了空数组。所以我不知道我在哪里犯了错。

文件MIN

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var name = $('#user_name').val();
var lname = $('#user_lastname').val();

function formLogin(name, lname)
{
$.ajax({ url: 'database/register.php',
     data: {
         'name' : name,
         'lname' : lname
     },
     type: 'post',
     dataType:'json',
     success: function(data) {
                  alert(data);
              }
});
}

HTML表单：

1
2
3
4
5
6
<form class="circleForm" id="registerForm">
     Imi?: <input type="text" id="user_name">
     Nazwisko: <input type="text" id="user_lastname">
   
<input class="btnCircle" type="button" id="submit" value="Przejd? dalej" onclick="formLogin(name, lname)">                    
 </form>

PHP代码：

$dane = $_POST;
echo json_encode($dane);

铬DEV:enter image description here

我只想知道如何在php文件register.php中回显这个变量(name，lname)。

带序列化的版本：

1
2
3
4
5
6
7
8
9
10
11
12
function formLogin() {
        var dane = $('form').serialize();
    $.ajax({
        url: 'database/register.php',
        data: {'dane': dane},
        method: 'post',
        success: function(data) {
            console.log(data);
        }
    });
 
}

然后结果控制台：

1
2
3
4
5
[cc lang="javascript"]
<small>D:\xampp\htdocs\szkola\database
egister.php:8:</small>
array (size=1)
  'dane' <font color='#888a85'>=&gt;</font> <small>string</small> <font color='#cc0000'>''</font> (length=0)

jquery-3.2.1.min.js:4xhr完成加载：post"http://localhost/szkola/database/register.php"。< /代码>

但是当我访问http://localhost/szkola/database/register.php时

我明白这一点：

D:xampphtdocsszkoladatabase
egister.php:8:数组(大小＝0)空的

相关讨论

您需要更改在JavaScript中定义变量的方式，并在函数内部声明变量，而不是在函数外部声明变量：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function formLogin(){

    var name = $('#user_name').val();
    var lname = $('#user_lastname').val();

    $.ajax({ url: 'database/register.php',
         data: {
             'name' : name,
             'lname' : lname
         },
         type: 'post',
         dataType:'json',
         success: function(data) {
             alert(data);
         }
    });
}

您需要以同样的方式更新您的HTML(formLogin()而不是formLogin(...,...))：

1
2
3
4
5
6
<form class="circleForm" id="registerForm">
     Imi?: <input type="text" id="user_name">
     Nazwisko: <input type="text" id="user_lastname">
   
<input class="btnCircle" type="button" id="submit" value="Przejd? dalej" onclick="formLogin()">                    
 </form>
相关讨论

尝试使用method而不是type。

HTML：

1
2
3
4
5
<form class="circleForm" id="registerForm">
    Imi?:       <input type="text" id="user_name" name="name"><br />
    Nazwisko:   <input type="text" id="user_lastname" name="lname"><br />
    <input class="btnCircle" type="button" id="submit" value="Przejd? dalej" onclick="formLogin();">                    
</form>

JavaScript：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function formLogin() {

    // Serialize the form
    var data = $('form').serialize();

    // Ajax call
    $.ajax({
        url: 'database/register.php',
        data: data,
        method: 'post',
        dataType: 'json',
        success: function(data) {
            console.log(data);
        }
    });

}

还请记住，您请求的是一个JSON，因此您必须在PHP文件中回送一个json_encode($array)，这样就不会返回一个简单的字符串。

相关讨论