使用ajax

时间:2016-05-22 09:33:14

标签: php jquery ajax codeigniter

我对codeigniter中的ajax不太熟悉。我只想显示我刚刚在div中输入的第一个名字和姓氏(id)。但是当我点击提交时,页面只会重新加载。怎么了 ?提前致谢。 那么这是我的查看文件employee.php

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <div class="box">
    <h1><?php echo lang('employee:insert'); ?></h1>
    <div class="form_box">
        <?php

            echo form_open(); //form open

            echo form_label('First Name: ', 'fn');
            $data = array('name' => 'first_name','type' => 'text', 'id' =>'first_name');
            echo form_input($data)."<br>";

            echo form_label('Last Name: ', 'ln');
            $data = array('name' => 'last_name','type' => 'text', 'id' => 'last_name');
            echo form_input($data)."<br>";

            $data = array('type' => 'submit', 'value' => 'Submit', 'id' => 'submit');
            echo form_submit($data);

            echo form_close(); // form close
        ?>
    </div>
</div>
<div id="result">
    here 
</div>


<script type="text/javascript">
    $(document).ready(function() {
        $("#submit").click(function(event) {
            event.preventDefault();
            var first_name: $('input#first_name').val();

            $.ajax({
                type: "POST",
                url: "<?php echo site_url('admin/employee/insert'); ?>",
                dataType: 'text',
                data: {name: first_name},
                success: function(data) {
                    if(res) {
                        $("div#result").html(res.un);
                    }
                }
            });
        });
    });
</script>

这是我的控制器文件admin.php

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

class Admin extends Admin_Controller {
    public function __construct() {
        parent::__construct();

        $this->lang->load("employee");
        $this->load->model('emp_model');

        $this->template
            ->append_css("module::admin.css")
            ->append_js("module::admin.js")
            ->append_js("module::jquery-2.2.3.min.js");
    }

    public function index() {
        $this->template->build("admin/employee");
    }

    public function insert() {
        $data = array(
                'first_name' => $this->input->post('first_name'),
                'last_name' => $this->input->post('last_name')
            );

        echo json_encode($data);
    }
}

1 个答案:

答案 0 :(得分:0)

在您的ajax中,您只发送一个参数data: {name: first_name}, 并且您在控制器中获取两者都产生内部服务器错误..在控制器中看到,您没有从您的ajax请求发送$this->input->post('last_name');

您的错误:您只是从ajax请求发送一个参数,即&#39; name&#39;在控制器中,您将获取first_name,last_name。你也在向错误的网址发送请求,为什么你在网址中使用员工<?php echo site_url('admin/employee/insert'); ?>

尝试发送类似

的参数
<script type="text/javascript">
    $(document).ready(function() {
        $("#submit").click(function(event) {
            event.preventDefault();
            var first_name = $('input#first_name').val();
            var last_name = $('input#last_name').val();
            $.ajax({
                type: "POST",
                url: "<?php echo site_url('admin/insert'); ?>",
                dataType: 'text',
                data: {'first_name': first_name,'last_name':last_name},
                success: function(data) {
                    if(data) {
                        $("div#result").html(data);
                    }
                }
            });
        });
    });
</script>

注意:我在您的ajax帖子请求中添加了var last_name: $('input#last_name').val();,并将此{name: first_name}更改为data: {'first_name': first_name,'last_name':last_name}

希望它有所帮助!