序列化表单并将ajax发布到函数

时间:2014-10-03 09:42:36

标签: javascript php jquery ajax

我正在尝试将表单字段值传递给位于文件中的php函数。问题是我无法理解如何将该序列化表单数据从此ajax传递给php中的函数。

$('#insert_news').submit(function(event) {
    event.preventDefault();
    var form = $('#insert_news').serialize();
    $.ajax({
        type: 'POST',
        url: 'includes/ajax.php',
        data: {
            action: 'insert_news',
            $('#insert_news').serialize(); // how do I add this data here?
        },
        success: function(datas) {
            $('#message').html(datas).show() /*fadeIn(1000).fadeOut(1000)*/ ;
        }
    });
});

这个ajax将值传递给文件ajax.php。从ajax.php调用函数.php。

ajax.php

if (isset($_POST['action']) && $_POST['action'] == 'insert_news') {
    $cp->insert_into_table('newss', array(
                                        'NewsTitle' => $_POST['title'], 
                                        'NewsDescrption' => $_POST['description'], 
                                        'Date' => date('Y-m-d H:i:s'), 
                                        'status' => '1'
                                    )
                           );
}

function.php

public function insert_into_table($table_name, array $data){
    foreach($data as $col=>$value) {
        $cols[] = $col;
        $values[] = '\''.$value.'\'';
    }
    $cols = implode(', ', $cols);
    $values = implode(', ', $values);
    $this->db->query("INSERT INTO $table_name ($cols) VALUES ($values)");
    echo "INSERT INTO $table_name ($cols) VALUES ($values)";
}

4 个答案:

答案 0 :(得分:2)

您可以通过ajax将序列化数据传递给您正在执行的功能,但您的代码需要稍作修改。

$('#insert_news').submit(function(event) {
    event.preventDefault();
    var form = $('#insert_news').serialize();
    $.ajax({
        type: 'POST',
        url: 'includes/ajax.php',
        data: {
            action: 'insert_news',
            serializedData: form // use variable to assign data here
        },
        success: function(datas) {
            $('#message').html(datas).show() /*fadeIn(1000).fadeOut(1000)*/ ;
        }
    });
});

答案 1 :(得分:2)

问题是serialize()生成一个URL编码的键值配对字符串,因此您无法将其与数据对象混合。

您可以使用serializeArray()获取表示表单元素的对象数组,然后迭代它们并将它们添加到数据对象中:

var data = { action: 'insert_news' };

$.each($('#insert_news').serializeArray(), function(){
    data[this.name] = this.value;
});

$.ajax({
    type: 'POST',
    url: 'includes/ajax.php',
    data: data,
    success: function(datas) {
        $('#message').html(datas).show() /*fadeIn(1000).fadeOut(1000)*/ ;
    }
});

旁注:您的PHP代码容易受到SQL注入攻击。考虑使用Prepared Statement而不是将用户输入连接到SQL中。

答案 2 :(得分:0)

$('#insert_news').submit(function(event) {
    var name = $("#t1").val();
    var pass = $("#t2").val();  //add more var as u need
    var key  = 0;

     var formName = new FormData();

     formName.append(key++,name)
     formName.append(key++,pass)    //append the the var to formdata


        $.ajax({
            url         :   'includes/ajax.php',
            dataType    :   'text',
            cache       :   false,
            contentType :   false,
            processData :   false,
            data        :   formName,                                    
            type        :   'post',

            success     :   function(data){
                        $('#message').html(data).show() /*fadeIn(1000).fadeOut(1000)*/ ;
                }

        });
});

这对我来说很好: - )

答案 3 :(得分:0)

我认为你可以像这样使用替代

首先:在表单上添加隐藏的操作输入

<input type="hidden" name="action" value="insert_news"/>

然后你的ajax帖子就像这样

$('#insert_news').submit(function(event) {
    event.preventDefault();
    $.ajax({
        type: 'POST',
        url: 'includes/ajax.php',
        data: $(this).serialize(), // $(this) is from <form id="insert_news">
        success: function(datas) {
            $('#message').html(datas).show() /*fadeIn(1000).fadeOut(1000)*/ ;
        }
    });
});

然后在你的ajax.php上使用print_r

print_r($_POST);