php - Codeigniter:如何使用ajax修复分页链接,单击时不更新
问题描述
我正在尝试使用 ajax 将分页链接放入我的网站以防止页面刷新。我设法使它工作,但分页链接没有更新。当我单击下一页时,页面将加载,但分页链接将保留在第 1 页上。我尝试将变量放入$this->pagination->create_links();
变量并将其回显到 div 中,但它什么也没显示。这是我的代码:
模型:
public function get_posts($limit = FALSE, $rowno = FALSE)
{
if($limit)
{
$this->db->limit($limit, $rowno);
}
$this->db->select('*, posts.image AS post_image, posts.id AS post_id, posts.user_id AS post_user_id');
$this->db->from('posts');
$this->db->join('categories', 'categories.id = posts.category_id');
$this->db->join('users', 'users.id = posts.user_id');
$this->db->order_by('posts.created_at', 'DESC');
$query = $this->db->get();
return $query->result_array();
}
控制器:
public function index()
{
// pagination page number
$pageno = $this->input->post('pageno');
// pagination config
// $config['base_url'] = base_url()."posts/index";
$config['base_url'] = '#';
$config['total_rows'] = $this->db->count_all('posts');
$config['per_page'] = 2;
$config['num_links'] = 3;
$config['attributes'] = array('class' => 'pagination-class');
$config['full_tag_open'] = '<div id="paginator">';
$config['full_tag_close'] = '</div>';
$data['posts'] = $this->post_model->get_posts($config['per_page'], $pageno);
$data['title'] = 'Latest Posts';
$data['pagination'] = $this->pagination->create_links();
$data['row'] = $pageno;
// init pagination
$this->pagination->initialize($config);
$this->load->view('posts/index', $data);
}
看法:
<div id="pagination">
<?php echo $this->pagination->create_links(); ?>
</div>
阿贾克斯:
$('#paginator').on('click', 'a', function(e) {
e.preventDefault();
var pageno = $(this).attr('data-ci-pagination-page');
$.ajax({
data : { 'pageno' : pageno },
method : 'post',
// dataType : 'json',
url : base_url + 'posts/index',
success : function(response) {
$("#main_container").html(response);
}
});
解决方案
可能是您使用了错误的元素 ID?
pagination X paginator
?
<div id="pagination"> </div>
$('#pagination') /* .... */
推荐阅读
- python - 检查两个 csv 文件的两列值,如果找到匹配,则写入另一个 csv 文件
- sql - 连接两个表并找到最早的日期 SQL
- apache-kafka - Kafka Streams:混合搭配 PAPI 和 DSL KTable 不共同分区
- javascript - Ajax 回调在函数调用后触发
- machine-learning - 在 tensorflow.js 中将预测值 Y 获取到一定数量的 X 值
- json - VueJs Axios Post FormData 参数
- javascript - 在事件 jquery 中使用 off()
- python - For 循环和字典
- javascript - 循环检查复选框并有条件地禁用未选中
- math - Aruco 地标变换 3D 矩阵