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

Question

我正在使用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> 

Answer 1

为了您的具体问题，你在做什么是好的，但也许添加自定义处理器服务器端以便能够将两者结合起来。

$(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()));