jquery $ .post无法在第二个请求上发送数据

时间:2015-06-11 18:38:16

标签: php jquery ajax

我在一个页面上显示的数据库中有一堆记录。每条记录都有自己的表单,并带有更新和删除按钮。我正在使用JQuery ajax将数据发送到PHP页面来处理表单。

第一次按下任何一个表单上的任何一个按钮时,脚本运行正常,但是当我按下任何一个表单上的另一个按钮(甚至是同一表单上的同一个按钮)时,ajax请求不会t将任何数据发送到PHP页面。

代码我用于在页面上输出数据:

<?php
foreach($records as $data) {
?>      
        <form>
            <input type="number" name="et" step="0.01" value="<?php echo $data->et; ?>" />
            <input type="hidden" name="token" value="<?php echo $token; ?>" />
            <input type="hidden" name="id" value="<?php echo $data->et_id; ?>"/>
            <input type="submit" name="update" value="Update" />
            <input type="submit" name="delete" value="Delete" />
        </form>
<?php
}

使用Javascript:

$(document).ready(function() {
    var buttonName;

    $('input[type=submit]').click('click', function() {
        buttonName = $(this).attr('name');
    });

    $('form').on('submit', function(e) {
        e.preventDefault();
        var values = $(this).serializeArray();
        console.log(values);

        if(buttonName == 'delete') {
            var message = confirm('Are you sure you want to delete this record?\n\n You can\'t get it back once you do.');
        } else {
            message = true;
        }

        if(message) {
            $.post('submit/raw_et.php', {et: values[0].value, token: values[1].value, id: values[2].value, button: buttonName}, function(r) {
                console.log(r);
            });
        }
    });
});

PHP代码段:

echo $_POST['button'];
echo $_POST['et'];
echo $_POST['id'];

javascript中的“values”变量始终具有正确的数据,但是在第一次按下按钮后,ajax无法发送任何数据,结果返回空白。

我不明白为什么它不会发送数据。我错过了一些非常简单的东西,还是更复杂的东西?

修改 我已经取出了html中的表格,但仍然得到了相同的结果。

1 个答案:

答案 0 :(得分:0)

您正在以完全错误的模式开发,而不是在tr中定义表单,使用记录ID和注册事件来单击按钮:

<?php
foreach($records as $data) {
?>      
    <tr>

            <td><input type="number" name="et" step="0.01" value="<?php echo $data->et; ?>" /></td>
            <input type="hidden" name="token" value="<?php echo $token; ?>" />
            <input type="hidden" name="id" value="<?php echo $data->et_id; ?>"/>
            <td><a class='edit' meta-id="<?php echo $record; ?>">edit</a></td>
            <td><a class='delete' meta-id="<?php echo $record; ?>">delete</a></td>

    </tr>
<?php
}
?>

现在,尝试注册所有按钮以进行删除和编辑。

$(".edit").click(function() {
    var record = $(this).attr("meta-id"); 
    $.post("edit uri" , {record : record , otherparam: valueofit} , function(result) {
          alert(result);
    }); 
});


$(".delete").click(function() {
    var record = $(this).attr("meta-id"); 
    $.post("delte uri" , {record : record} , function(result) {
          alert(result);
    }); 
});

您可以根据需要扩展概念,减少向按钮添加类等等。