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