使用jquery在一个页面中处理多个页面请求

时间:2013-08-31 18:53:01

标签: php javascript jquery codeigniter

我正在使用Codeigniter并且我一直在尝试在一个页面中加载多个分页..但是在搜索了许多不同的论坛和网页后,我决定创建多个方法和视图,并使用jquery在一个页面中加载它们。我使用这段代码,效果很好.. 我能够在一个页面中加载多个页面,但无法在特定的div标签中处理他们的请求。

例如,城市在我的索引页面中加载了分页,但是当我点击Page 2链接时,它会重新映射到分页生成的链接,area/get_all_cities/5不在区域/索引内。我希望在城市div标签内加载该请求。我是Jquery的新手,因此不知道在div标签内的一个页面中编写哪个函数来处理多个请求。

我的index.php

<script>
$(document).ready(function() {
$('#division').load('<?=site_url('area/get_all_divisions')?>');
$('#city').load('<?=site_url('area/get_all_cities')?>');
});
</script>

<div id="division"></div>

<div id="city"></div>

我的区域控制器

function get_all_divisions($start = 0){

$data['divisions']=$this->mdl_area->get_all_divisions(5,$start);
$this->load->library('pagination');
$config['base_url']=base_url().'area/get_all_divisions';
    $config['total_rows']= $this->mdl_area->get_division_count();
    $config['per_page']= 5;
    $this->pagination->initialize($config);
$this->load->view('area/get_division',$data);
}

function get_all_cities($start = 0){

$data['cities']=$this->mdl_area->get_all_cities(5,$start);
$this->load->library('pagination');
$config['base_url']=base_url().'area/get_all_cities';
    $config['total_rows']= $this->mdl_area->get_city_count();
    $config['per_page']= 5;
    $this->pagination->initialize($config);
$this->load->view('area/get_city',$data);
}

get_city.php

<div class="fwrapper">
    <table class="table">
      <thead>
        <tr>
          <th>Cities</th>
        </tr>
      </thead>
      <tbody>
<?php foreach ($cities as $row) { ?>
        <tr>
          <td><?=$row['name']?></td>
        </tr>
<? } ?>
      </tbody>
    </table>

    <?php echo $this->pagination->create_links();?>

</div>

1 个答案:

答案 0 :(得分:0)

针对您的具体问题,您正在做的事情很好,但可能会添加一个自定义处理程序服务器端,以便能够将两者结合起来。

$(function() {
    //tiny bit more optimized to call one function when the document is ready instead of 2.
    $('#division').load('<?=site_url('area/get_all_divisions')?>');
    $('#city').load('<?=site_url('area/get_all_cities')?>');

    //assuming the paginate links have the class 'paginate'.
    $('#division').on('click', 'a.paginate', function() {
        $('#division').load($(this).attr('href'));
    return false;
    });

    $('#city').on('click', 'a.paginate', function() {
        $('#city').load($(this).attr('href'));
    return false;
    });
});

我的意思是:

$(function() {
    $.getJSON('<?=site_url('api.php')?>?get=all_divisions,all_cities', function(data) {
        $('#division').html(data.division);
        $('#city').html(data.all_cities);
    });
});

在服务器端:

<?php
///code to handle both requests and getting the result

header('content-type: application/json');
echo json_encode(array('cities' => get_all_cities(), 'division' => get_all_divisions()));