如何使用AJAX和PHP发送数据

我试图用AJAX和PHP（CodeIgniter框架）实现一个评论框。这是代码

视图（HTML代码）：

我想要一个系统，用户可以评论和评论可以显示。我正试图找出代码不起作用的原因，请协助，我对AJAX比较陌生。

试试这个：

<script>
$(document).ready(function(){
    $('#submit').click(function(e){
        // remove the error class
         $('.input-group').removeClass('has-error');
         //remove the previous  
    $('.help-block').remove(); 
        var datastring = $("#form").serialize();

        $.ajax({
            type:'POST',
            url: "<?php echo base_url('display_scenery/add_comment')?>",
            data: datastring,
            datatype: 'json',
            cache: 'false',
            encode: true
        });
        .done(function(data)
        {
              // log data to the console so we can see
            console.log(data);
            // here we will handle errors and validation messages
        if(!data.success){

            $('#data.errors.input-group'){
                $('#iput-group').addClass('has-error');
                $('#iput-group').append('<div class= "help">' + data.errors.Comment+'</div>');
            }
            else
            {
                $('#form').append('<div class="alert">'+ data.message+'</div>');
            } 
            )};
        .fail(function(data) {

        // show any errors
        // best to remove for production
        console.log(data);
    });

        }*/
            // prevent default action
    e.preventDefault();
    });

});


</script>

$（文档）.ready（函数（）{
$（“#提交”）。单击（函数（e）{
//删除错误类
$（'.input group'）.removeClass（'has-error'）；
//删除上一个
$（'.help块'）.remove（）；
var datastring=$（“#form”）.serialize（）；
$.ajax({
类型：'POST'，
url:“”，
数据：datastring，
数据类型：“json”，
缓存：“false”，
编码：正确
});
.完成（功能（数据）
{
//将数据记录到控制台，以便查看
控制台日志（数据）；
//这里我们将处理错误和验证消息
如果（！data.success）{
$（“#数据.错误.输入组”）{
$（“#iput group”）.addClass（'has-error'）；
$（“#iput group”）.append（“”+data.errors.Comment+“”）；
}
其他的
{
$（'#form'）.append（''+data.message+''）；
} 
)};
.失败（功能（数据）{
//显示任何错误
//最好将其移除以便生产
控制台日志（数据）；
});
}*/
//防止默认操作
e、 预防默认值（）；
});
});

试试这个：

<script>
$(document).ready(function(){
    $('#submit').click(function(e){
        // remove the error class
         $('.input-group').removeClass('has-error');
         //remove the previous  
    $('.help-block').remove(); 
        var datastring = $("#form").serialize();

        $.ajax({
            type:'POST',
            url: "<?php echo base_url('display_scenery/add_comment')?>",
            data: datastring,
            datatype: 'json',
            cache: 'false',
            encode: true
        });
        .done(function(data)
        {
              // log data to the console so we can see
            console.log(data);
            // here we will handle errors and validation messages
        if(!data.success){

            $('#data.errors.input-group'){
                $('#iput-group').addClass('has-error');
                $('#iput-group').append('<div class= "help">' + data.errors.Comment+'</div>');
            }
            else
            {
                $('#form').append('<div class="alert">'+ data.message+'</div>');
            } 
            )};
        .fail(function(data) {

        // show any errors
        // best to remove for production
        console.log(data);
    });

        }*/
            // prevent default action
    e.preventDefault();
    });

});


</script>

$（文档）.ready（函数（）{
$（“#提交”）。单击（函数（e）{
//删除错误类
$（'.input group'）.removeClass（'has-error'）；
//删除上一个
$（'.help块'）.remove（）；
var datastring=$（“#form”）.serialize（）；
$.ajax({
类型：'POST'，
url:“”，
数据：datastring，
数据类型：“json”，
缓存：“false”，
编码：正确
});
.完成（功能（数据）
{
//将数据记录到控制台，以便查看
控制台日志（数据）；
//这里我们将处理错误和验证消息
如果（！data.success）{
$（“#数据.错误.输入组”）{
$（“#iput group”）.addClass（'has-error'）；
$（“#iput group”）.append（“”+data.errors.Comment+“”）；
}
其他的
{
$（'#form'）.append（''+data.message+''）；
} 
)};
.失败（功能（数据）{
//显示任何错误
//最好将其移除以便生产
控制台日志（数据）；
});
}*/
//防止默认操作
e、 预防默认值（）；
});
});

既然你是新来的，我建议你去阅读，我们是来帮助你的，不是为你写代码的。但是我已经写了上面的代码，我只想有人指出错误。你在控制器中定义

消息的位置以及你是如何在视图中显示评论的？请参见这里的
$（'#form'）.append（''+data.message+''）您需要在controllerStart中定义$data['message']`而不是将按钮设置为type=“submit”-这会导致浏览器执行您不想要的额外操作。您正在自行处理提交内容。由于您是新手，我建议您去阅读，我们是来帮助您的，而不是为您编写代码。但我已经编写了上述代码，我只希望有人指出错误。您在控制器中定义
消息的位置以及如何在视图中显示注释？请参见这里的
$（'#form'）.append（''+data.message+''）您需要在controllerStart中定义$data['message']`而不是将按钮设置为type=“submit”-这会导致浏览器执行您不想要的额外操作。您正在自行处理提交。您好，Kelvin，我将变量更改为var datastring=$（“#form”）.serialize（）；但是仍然没有检测到ajax，表单以对流方式加载；但是仍然没有检测到ajax，表单以对流方式加载。
public function add_comment(){
    if(!$this->session->userdata('logged_in')) {
        $data['error'] = 'Signup needed to comment on a scenery';
    } else {
        $this->load->library('form_validation'); 
        $session_data = $this->session->userdata('logged_in');
        $User_id= $session_data['User_id'];
        $scenery_id = $_POST['Scenery_id'];
        $Comment=$_POST['Comment'];
        $this->form_validation->set_rules('Comment', 'Comment', 'trim|required');
        if($this->form_validation->run() == FALSE) {
            $data['error'] = validation_errors();
        } else {
            //loads the model image_display then redirects to scenery page
            $this-> image_display->add_comment( $scenery_id,$User, $Comment); 
            $data['Comment']=$this-> image_display->get_comments($scenery_id);
            $data['success'] = TRUE;
        }
    }
    echo json_encode($data);
}

<script>
$(document).ready(function(){
    $('#submit').click(function(e){
        // remove the error class
         $('.input-group').removeClass('has-error');
         //remove the previous  
    $('.help-block').remove(); 
        var datastring = $("#form").serialize();

        $.ajax({
            type:'POST',
            url: "<?php echo base_url('display_scenery/add_comment')?>",
            data: datastring,
            datatype: 'json',
            cache: 'false',
            encode: true
        });
        .done(function(data)
        {
              // log data to the console so we can see
            console.log(data);
            // here we will handle errors and validation messages
        if(!data.success){

            $('#data.errors.input-group'){
                $('#iput-group').addClass('has-error');
                $('#iput-group').append('<div class= "help">' + data.errors.Comment+'</div>');
            }
            else
            {
                $('#form').append('<div class="alert">'+ data.message+'</div>');
            } 
            )};
        .fail(function(data) {

        // show any errors
        // best to remove for production
        console.log(data);
    });

        }*/
            // prevent default action
    e.preventDefault();
    });

});


</script>