0

我无法让 ajax 与 jquery 和 codeigniter 一起使用。我已经遵循了多个教程，但似乎没有任何效果。我正在尝试实现一个投票按钮，该按钮使用 ajax 发送帖子数据以插入数据库。任何帮助深表感谢。

我认为的代码：

<pre>
<?php foreach($query->result() as $row): ?>
<div>
<form action="" method="post">
<input type="hidden" name="story_id" value=<?php echo $row->id; ?>>
<input type="submit" name="story_id" class="button" id="submit_btn" value=<?php echo      $row->id;?>>
</form>
</div>
<?php endforeach; ?>
</pre>

我正在使用的 jquery 脚本：

<pre>
<script type="text/javascript">
$(document).ready(function(){
$(".button").click(function(){
    var form_data = {
        story_id: $(this).val()
    };
    $.ajax({
        url: "<?php echo base_url('cyoa/upvote'); ?>",
        type: 'POST',
        data: form_data,
        success: function() 
            {
            $("#upvote").hide();
            }
    });
    return false;
});
});

</script>
</pre>
4

4 回答 4

1

最好的方法是序列化您的表单数据并将其发送到服务器：

<script type="text/javascript">
$(document).ready(function(){
  $(".button").click(function(){
    var form_data = $("#myform").serialize();
    $.ajax({
        url: "<?php echo base_url('cyoa/upvote'); ?>",
        type: 'POST',
        data: form_data,
        success: function() 
            {
            $("#upvote").hide();
            }
    });
    return false;
  });
});

</script>

要访问表单，请给它一个 id：

<form id="myform" action="" method="post">
于 2012-10-05T17:28:04.133 回答
0

尝试使用 json 对象，

看法....

<pre>
<?php foreach($query->result() as $row): ?>
<div>
<form action=" controller_name/upvote" method="post">
<input type="hidden" name="story_id" id = "story_id" value=<?php echo $row->id; ?>>
<input type="submit" name="story_id" class="button" id="submit_btn" value=<?php     echo      $row->id;?>>
</form>
</div>
<?php endforeach; ?>
 </pre>

然后你的控制器，

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Controller_name extends CI_Controller {

function __construct()
{
    parent::__construct();

    //loading libraries
    $this->load->helper(array('form','url'));

    $this->load->library('form_validation');


}
//##############################################################################
    function upvote(){


    //setting validation rules
    $this->form_validation->set_rules('story_id', 'story Id', 'required|xss_clean');


    if ($this->form_validation->run() == true){

        //if validations ok, send the  data to  database
        $this->load->model('your_model');

        $params = ($this->input->post('story_id');

        $query = 'INSERT INTO table_name (story_id) VALUES(?)';
        $result = $this->your_model_name->method_name($query,$params);

        echo '{"validation_result": "passed"}';

    }
    else{
        $output = '{"story_id":"'.form_error('story_id').'"}';

        echo $output;
        }

}
}
?>

然后你的java脚本文件

$(document).ready(function(){
$('#submit_btn').live('click',function(){

    var form_data = {
                    $story_id: $('#story_id').val()
                };

                $.ajax({
                    type: "POST",
                    url: baseurl+"controller_name/upvote",
                    dataType: "json",
                    data : form_data,
                    success: 
                        function(data){

                            if(data.validation_result == "passed"){

                                $("#upvote").hide();


                            }
                            else{
                                //form_validation errors
                                }
                        }
                    });

        return false;   
    });
});
于 2012-10-06T10:31:06.563 回答
0

我强烈建议看看这个插件（并使用它）：

jQuery 表单插件

于 2012-10-05T17:23:21.160 回答
0

您可以使用表单序列化将数据传递给 php，如下所示

首先给你的表单标签ID“storyform”

$.ajax({
        url: "<?php echo base_url('cyoa/upvote'); ?>",
        type: 'POST',
        data: $("#storyform").serialize(),
        success: function() 
            {
            $("#upvote").hide();
            }
    });
于 2012-10-05T17:27:09.403 回答