2012-06-07 2 views
3

Я пытаюсь добавить бесконечную прокрутку в разбивку на страницы с помощью этого плагина.Добавление бесконечного прокрутки в кодignign pagination

http://www.infinite-scroll.com 

Это мои коды до сих пор:

<script type = "text/javascript"> 

    $('#comments').infinitescroll({ 

     navSelector : "a#next:last", // selector for the paged navigation (it will be hidden) 
     nextSelector : "a#next:last", // selector for the NEXT link (to page 2) 
        itemSelector : "#comments"  // selector for all items you'll retrieve 
       }); 

</script> 

Это использование по умолчанию. Предположим, что #comments содержат мой контент. Моя страница с разбивкой на страницы выглядит примерно так.

http://localhost/ci/index.php/chat/load/p1u/10 
http://localhost/ci/index.php/chat/load/p1u/20 

т.д.

Я даже добавили эту строку кода, чтобы заставить его работать, но без успеха:

<a id="next" href="http://localhost/ci/index.php/chat/load/p1u/10">next page</a> 

Любые идеи?

+1

Я нашел обходное решение. Я использовал jquery, чтобы определить, когда я дошел до конца прокрутки div и добавлю содержимое из load/p1u/10 в html. Поскольку следующая страница, очевидно, будет/20/30 и т. Д., Я сохранил глобальную переменную, которая увеличивается каждый раз на 10, когда достигнут конец окна. Это прекрасно работает, и содержимое отображается соответствующим образом. –

ответ

1

Переключиться на использование $config["use_page_numbers"] в pagination.php, если вы хотите использовать/1/2/3 вместо/10/20/30.

1

Я обнаружил, что это определенно работает лучше с $ config ["use_page_numbers"] = TRUE; но если вы собираетесь идти по этому маршруту, вам придется настроить смещение. Это, как я получил это работает:

$offset = ($this->uri->segment(2)) ? ($this->uri->segment(2) * $config["per_page"]) - $config["per_page"] : 0; 
0

У меня есть простой шаг для прокрутки пагинацией в коде воспламенитель, я есть это проверить его работу лучше

$(window).scroll(function(){ 
    if ($(window).scrollTop() == $(document).height() - $(window).height()){ 
     // run our call for pagination 
     var table = document.getElementById("table"); 
     var lastRowIndex = table.rows.length-1; 
     loadMore(lastRowIndex); 
    } 
}); 

function loadMore(lastRowIndex) 
{ 
$.ajax({ 
    url: "http://localhost/CodeIgniter/index.php/form/loadmore", //form is y controller 
    type:'POST', 
    data: "row="+lastRowIndex, // row wich is post 
    success: function(data){ //here data which recevie form controller 
     var json = JSON.parse(data); 
     var count = json.length; 
     var html; 
     for(var i = 0; i < count; i++) 
     { 
      html += '<tr>'; 
      html += '<td><input type="checkbox" name="id[]" id="id[]" class="check" value="'+ json[i].id +' "></td>'; 
      html += '<td>'+ json[i].id +'</td>'; 
      html += '<td><img src="http://localhost/CodeIgniter/upload/'+ json[i].image +'" class="img-circle" height="25" width="30"></td>'; 
      html += '<td> ' + json[i].firstname +'</td>'; 
      html += '<td> ' + json[i].middlename +'</td>'; 
      html += '<td> ' + json[i].lastname +'</td>'; 
      html += '<td> ' + json[i].address +'</td>'; 
      html += '<td> ' + json[i].mobile +'</td>'; 
      html += '<td> ' + json[i].email +'</td>'; 
      html += '<td> ' + json[i].gender +'</td>'; 
      html += '<td><a href="http://localhost/CodeIgniter/index.php/form/del/'+ json[i].id +'">Delete</a></td>'; 
      html += '<td><a href="http://localhost/CodeIgniter/index.php/form/edite/'+ json[i].id +'">Update</a></td>'; 
      html += '</tr>'; 
     }$("#body").append(html); //add this html to th table body which id='body' 
    } 
}); 
} 

я использовать эту функцию контроллер

public function loadmore() 
{ 
    $page=$_POST['row']; 
    $per_page = 10; 
    $student = $this->Form_model->getview_detail($per_page,$page); 
    if($student !== FALSE) 
    { 
     echo json_encode($student); //send data to script 
    } 
} 

`

и это модель

public function getview_detail($limit, $start) 
{ 
    $this->db->limit($limit, $start); 
    $query = $this->db->get('form'); 
    return $query->result_array(); 
}