為什么 jQuery.ajax() 不發送任何數據？

Question

請告訴我，有一個表格可以將數據發送到數據庫。 沒有腳本它工作正常，但腳本沒有任何反應。 在控制台中——Form Data 有所有數據，第 200 個代碼到達，但沒有添加到數據庫中。

PHP：

<?php
    $data = $_POST;

    if (isset($data['add'])) {
        $posts = R::dispense('posts');      
        $posts->head = $data['head'];
        $posts->desc = $data['desc'];
        R::store($posts);
    }
?>

HTML：

<form method="POST" id="FormID">
    <input type="text" name="head" required />
    <input type="text" name="desc" required />

    <button type="submit" name="add">Добавить</button>

JS：

<script>
    $("#FormID").submit(function(e)
    {
        var form = $(this);
        var url = form.attr('action');
        e.preventDefault();

        $.ajax({
            type: "POST",
            url: url,
            data: $("#FormID").serialize(),
            success: function(data)
            {
                c = "hello";
                $('#FormStatus').text(c);
            }
        });
    });
</script>

Answer 1

你說：

 if (isset($data['add'])) {

所以代碼只有在add數據時才會做任何事情。

 <button type="submit" name="add">Добавить</button>

add是一個提交按鈕。 當您提交表單時，它將包含在數據中。

 data: $("#FormID").serialize(),

您沒有提交表單。 jQuery serialize不包括提交按鈕，因為當您不提交表單時，它們不是成功的控件。

使用其他一些機制來確定是否有數據要處理（例如head和desc的存在。

Answer 2

1. 你忘了action為表單
2. 為什么不簡單地使用$data['name']而不是R::dispense ？
3. 如果您要做什么 POST 請求，為什么不使用$.post() ？

你需要的是這些：

PHP代碼：

<?php
    $data = $_POST;

    if (isset($data['add'])) {
        if(isset($data['head']) AND !empty($data['head']) AND isset($data['desc']) AND !empty($data['desc'])) {
            $head = htmlspecialchars($data['head']);
            $desc = htmlspecialchars($data['desc']);
            echo "Hello from server";
        }
        else {
            echo "Please fill the form";
        }
    }
?>

HTML：

<form method="POST" id="FormID" action="path_to_php_file.php">
    <input type="text" name="head" required />
    <input type="text" name="desc" required />
    <button type="submit" name="add">Добавить</button>
</form>

JS：

<script>
    $("#FormID").submit(function(e)
    {
        e.preventDefault();
        var form = $(this),
            url = form.attr('action');

        var data = {};

        // To have post paramaters like
        // { 'head' : 'Head value', 'desc' : 'Desc value' }
        $.each(form.serializeArray(), function(i, field) {
            data[field.name] = field.value;
        });

        $.post(url, data, function(Responses) {
            // Will write "Hello from server" in your console
            console.log(Responses);
        });
    });
</script>