php - 使用jquery处理一页中的多个页面请求

Question

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

例如，城市在我的索引页面中加载分页，但是当我单击 Page 2 链接时，它会重定向到分页生成的链接，即 area/get_all_cities/5不在区域/索引内。我希望该请求加载到 city 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>

我的区域 Controller

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