5

codeigniterでjqueryプラグインscrollpaginationを使用していますが、ループが終了せず、正確な結果が得られないという問題に直面しています。

これは私のHTMLコードです

<div id="main">
    <div id='friend_display'>
    <?php if($list->num_rows() > 0  ){
            foreach($list->result() as $show)
            {   ?>

    <div class="image-box" style="margin-left:30px" id='image-holder' >

        <div class="photo-cover">
            <a href="<?=base_url()?>uploads/user_images/<?php echo $show->user_image;?>" class="big-image"><img width="160px" height="117px" src="<?=base_url()?>uploads/user_images/friends/<?php echo $show->user_image;?>" alt="" /></a>
        </div>

        <p class="photo-name"><b><?php echo $show->user_name;?></b></p>


    </div>
    <?php } } else { echo '<div align="center" style="color:#FF0000; font-size:17px; font-weight:bold">You have no Friends yet</div>';}?>

    <div class="cl">&nbsp;</div>
</div></div>

これはスクリプトです

  <script type="text/javascript">
  var page_num = 1; 
   $(function(){
$('#friend_display').scrollPagination({
    'contentPage': '<?=base_url()?>friends/load_more', // the url you are fetching the results
    'contentData': {page_num:$('.image-box').size()}, // these are the variables you can pass to the request, for example: children().size() to know which page you are
    'scrollTarget': $(window), // who gonna scroll? in this example, the full window
    'heightOffset': 10, // it gonna request when scroll is 10 pixels before the page ends
    'beforeLoad': function(){ // before load function, you can display a preloader div
        $('#loading1').fadeIn();    
    },
    'afterLoad': function(elementsLoaded){ // after loading content, you can use this function to animate your new elements
         $('#loading1').fadeOut();
         var i = 0;
         $(elementsLoaded).fadeInWithDelay();
         page_num:$('.image-box').size();
    }
});

// code for fade in element by element
$.fn.fadeInWithDelay = function(){
    var delay = 0;
    return this.each(function(){
        $(this).delay(delay).animate({opacity:1}, 200);
        delay += 100;
    });
};

 });
</script>   

これが私のphp関数です

  function load_more() 
{
    $offset =   $this->input->post('page_num');
    $list       =   $this->friends_model->show_friends($offset);
    if($list->num_rows()>0)
    {
        foreach($list->result() as $show)
        {?>

            <div class="image-box" style="margin-left:30px" id='image-holder'>
            <div class="photo-cover">
            <a href="<?=base_url()?>uploads/user_images/<?php echo $show->user_image;?>" class="big-image"><img width="160px" height="117px" src="<?=base_url()?>uploads/user_images/friends/<?php echo $show->user_image;?>" alt="" /></a>
            </div>

        <p class="photo-name"><b><?php echo $show->user_name;?></b></p>

    </div>
    <?php } ?>
    <div class="cl">&nbsp;</div>
    <?php
    } 
    else 
    {  
        //echo(333); 
    }
}

db i jstで、メインクエリ$ this-> db-> limit(12、$ offset);を表示します。誰かが私が欠けているものを教えてもらえますか?

このリンクを開いて、完全なコードを入手してください。スクロールページ付け

4

4 に答える 4

2

オフセットを取得する方法が正しくないと思います。(POST ['page_num']に何が入っているのかわからないので、よくわかりません)

$offset =   $this->input->post('page_num');

ページ番号を取得しているように見えますが、limit関数のオフセットは、スキップする必要のある行の量である必要があります。したがって、「ティック」オフセットごとに12の結果を表示している場合は、12*page_numberである必要があります。

$this->db->limit(12,$offset*12);

ページ番号にオフセットを残すと、間違った結果が得られます。

limit(12,[0,1,2,...]) // items 1-12, 2-13, 3-14 etc...

limit(12,[0,12,24....] //items 1-12, 13-24, 25-32 etc...
于 2013-03-13T21:19:36.897 に答える
1

ここで私はあなたがこれを試すことができる私自身の方法でこの問題を解決します。あなたのスクリプトでこの行を削除してください

'contentData': {page_num:$('.image-box').size()},

この行を追加します

 'childClass' : '.image-box',

scrollpagination.jsファイルを開いた後、この行 data: opts.contentData,をこれに置き換えますdata: {page_num : $(obj).children(opts.childClass).size()},'contentData' : {},再度、この行を。に置き換え'childClass' : '.datalist',ます。

関数をこの行function display_friends()に置き換えてください。その後、スクリプトを次のように記述します。exit;echo '<input type="hidden" id="nodata" value="1" />';

$(function(){

    $('#nomoreresult').hide();
    $('#loading1').hide();
    $('#friend_display').scrollPagination({

    'contentPage': 'Your_Url', // the url you are fetching the results
     // these are the variables you can pass to the request, for example: children().size() to know which page you are
    'childClass' : '.image-box',
    'scrollTarget': $(window), // who gonna scroll? in this example, the full window
    'heightOffset': 10, // it gonna request when scroll is 10 pixels before the page ends
    'beforeLoad': function(){ // before load function, you can display a preloader div
        $('#loading1').show().fadeIn();
    },
    'afterLoad': function(elementsLoaded){
     // after loading content, you can use this function to animate your new elements
        $('#loading1').hide().fadeOut();
        $(elementsLoaded).fadeInWithDelay();

        if($('#nodata').val() == '1'){
            $('#friend_display').stopScrollPagination();
            $('#loading1').hide();
            $('#nomoreresult').show().fadeIn();

        }

    }
});

// code for fade in element by element
$.fn.fadeInWithDelay = function(){
    var delay = 0;
    return this.each(function(){
        $(this).delay(delay).animate({opacity:1}, 200);
        delay += 1000;
    });
};
于 2013-03-20T11:31:15.180 に答える
0

やってみましたjQuery.noConflict()か?

  <script type="text/javascript">
  var page_num = 1; 
  jQuery.noConflict();
   $(function(){...

Edit2:オフセットが正しく機能していないようです。http://pastebin.com/MC1KZm8yによると

探す:

$offset =   $this->input->post('page_num');
$list       =   $this->friends_model->find($offset);

交換:

$page_line = 6; //for example
$page_num = $this->input->post('page_num');
$offset   = ($page_num -1) * $page_line;
$list       =   $this->friends_model->find($offset);
于 2013-03-18T12:49:30.893 に答える
0

この欠落しているコードをコード内に追加しafterLoad:function(){..ます。これにより、ページネーションのループが停止するはずです。入力したIDとまったく同じIDを追加してください。scrollpagination id <div id='friend_display'>

if ($('#friend_display').children().size() > 100){ //set the condition to where to stop
// if more than 100 results already loaded, then stop pagination (only for testing)
    $('#nomoreresults').fadeIn(); //if you want to show message like "No more result!" use this
    $('#friend_display').stopScrollPagination();// this is the most important function call
}

この内部の.scrollPagination({..変更は、display_friends()メソッドにロードおよび解析するビューファイルのみが含まれている必要があり、表示するデータとそのビュー内でforeachを使用してデータをエコーすることを意味します'contentPage': '<?php echo base_url();?>controller/action'action(){ $this->load->view('that_you_want_to_display');

于 2013-03-20T14:04:03.107 に答える