CodeIgniter:如何获取数据/选择数据并使用ajax请求附加到PHP代码

时间:2016-07-27 17:41:11

标签: php jquery ajax codeigniter

我的Codeigniter网站有侧面板,当我点击或选择侧面板中的任何选项时,主面板上会显示相应的内容。

首页URLhttp://localhost/main/userinfo

当我点击女性URL时,http://localhost/main/userinfo/female

我提出了一个从数据库中获取数据的ajax请求。我想我犯了一个错误。不知道它在哪里。 enter image description here

控制器(main.php)

class Main extends CI_Controller {
public function __construct() {
    parent::__construct();           
    $this->load->model('userinfo_model'); 
}
public function index() {}   
public function userinfo($gender) {
    $this->load->view('home/inc/header_view');        
    $usermain_data['user_info'] = $this->userinfo_model->get_data($gender);
    $this->load->view('home/main_view', $usermain_data);
}

模型(userinfo_model.php)

class Userinfo_model extends CI_Model {
function __construct() {
    // Call the Model constructor
    parent::__construct();
}
function get_data($gender) {      
    $this->db->select('*'); 
    if($gender == 'female'){
        $this->db->where('gender', 0); 
    }
    elseif($gender == 'male'){
        $this->db->where('gender', 1); 
    }
    elseif($gender == 'allusers'){
        $gNames = array(0, 1);             
        $this->db->where_in('gender', $gNames);
    } 
    else {
        redirect(base_url() . 'main/userinfo/allusers');
    }
    $query = $this->db->get('tble_proposal');
    return $query->result();
}}

查看(main_view.php)

<div class="container">  
<div class="row">
    <div class="col-md-3 side_menu">
        <div class="btn-group" data-toggle="buttons">
            <label class="btn btn-default gender-label" id="lbl-female" onclick="displayfemale()">
                <input type="radio" name="options" id="option1" autocomplete="off">
                <span>Female</span>
            </label>
            <label class="btn btn-default gender-label" id="lbl-male" onclick="displaymale()">
                <input type="radio" name="options" id="option2" autocomplete="off">
                <span>Male</span>
            </label>
        </div> <br> <br> 
        <label class="label nav-label">Age</label>
        <select class="btn nav-age-select" id="ageSelect1" autocomplete="off">
            <option value="18">18</option>
            <option value="19">19</option>
            <option value="20">20</option>       
            <option value="21"  selected="selected">21</option>
            <option value="22">22</option>
            <option value="23">23</option>       
            <option value="24">24</option>
            <option value="25">25</option>

        </select>
        <label class="label nav-label label-to">To</label>
        <select class="btn nav-age-select" id="ageSelect2" autocomplete="off">
            <option value="18">18</option>
            <option value="19">19</option>
            <option value="20">20</option>       
            <option value="21">21</option>
            <option value="22">22</option>
            <option value="23">23</option>       
            <option value="24">24</option>
            <option value="25" selected="selected">25</option>
        </select>

    </div>
    <div class="col-md-8 main-body">
        <div id="userdata">
            <?php
            foreach ($user_info as $info) {
                //confuse of adding date here with ajax
                //echo $info->content . '<br />' . $info->added_date .'<br />'; 
            }
            ?>
        </div>         
    </div>
</div>      

<script type="text/javascript"> 
$(document).ready(function () {
    var ajaxUrl     = '<?php echo base_url(); ?>' + 'main/userinfo';        
    var gender      = 'allusers'; // defual 1 for female and male both together

    getAjax(ajaxUrl, gender); 

    $("#lbl-female").click(function () {   
        gender = 'female';
        getAjax(ajaxUrl, gender);  
    });
    $("#lbl-male").click(function () {   
        gender = 'male';
        getAjax(ajaxUrl, gender);  
    });
});     
function getAjax(ajaxUrl, gender){       
    ajaxUrl = ajaxUrl + '/' + gender;                
    $.ajax({
        url: ajaxUrl,
        dataType: "JSON",
        type: "POST",
        success: function (retdata) { 
            //append data, Then do i have to change the data select part from the database 
        }
    });   
}

1 个答案:

答案 0 :(得分:0)

您有两个选择:

  1. 可以让AJAX调用控制器中的不同功能 返回一个JSON对象,用javascript代码处理它。
  2. 或者您可以使用您需要的html返回部分视图并放置 在userdata容器中。