1

jQuery からコントローラーにpage_numの値を取得したいのですが、更新された値を取得できません。最初に渡された値のみを取得しています。下にスクロールするとスクロールが継続的に結果を表示し、停止せず、すべての結果が表示されず、最初の6つを表示してから継続的に繰り返します。

jQuery ScrollPagination を使用していますが、問題を解決できません。助けてください。

これは私の見解です:

<div id="main" style="width:760px">
    <div id='friend_display'>
    <?php if($list->num_rows() > 0  ){
     foreach($list->result() as $show){     ?>
            <!-- image box -->
            <div class="image-box" style="margin-left:30px" id='image-holder' >

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

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

            </div>
    <?php } } else { echo '<div align="center" style="color:#FF0000; font-size:17px; font-weight:bold">You have no Friends yet</div>';}?>
            <!-- end image-box -->
            <div class="cl">&nbsp;</div>
    </div>
    <!-- end main -->
    </div>

 <div class="loading1" id="loading1">Wait a moment... it's loading!</div>
 <div class="loading1" id="nomoreresults">Sorry, no more results....!</div>

これは私のコントローラーです:

    <?php  if ( ! defined('BASEPATH')) exit('No direct script access allowed');
  class Friends extends CI_Controller {

    function __construct()
    {
            parent::__construct();
            $this->load->model('friends_model');
    }

    function find_friends($offset=0)
    {
            $friend['list']         =       $this->friends_model->find($offset);
            $this->load->view('friends_find_view',$friend);
    }


    function display_friends()
    {
            $offset =       $this->input->post('page_num');     
            $find   =       $this->friends_model->find($offset);

            if($find->num_rows() > 0        )
            {
                    foreach($find->result() as $show)
                    {       ?>

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

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

            </div>
    <?php } } else { exit; }?>
            <!-- end image-box -->
            <div class="cl">&nbsp;</div>
            <?php          
    }
  }  

$offsetをエコーすると、スクリプト内の bt のたびに 6 と表示され、page_numの値が正しく変更されます。これが主な問題です

これはモデルコードです

         function find($offset)
         {
            $this->db->select('*');
            $this->db->from('users');

            $this->db->limit(6,$offset);
            $result = $this->db->get();
            return $result;        
          }

最後に、これは私のスクリプトです

    <script type="text/javascript">
    var page_num = 1;
    $(function(){
    $('#friend_display').scrollPagination({
            'contentPage': '<?=base_url()?>friends/display_friends', // 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();
                     $(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>

この質問をするのは 2 回目ですが、今回は解決策が得られることを願っています。ここで完全なコードを見ることもできますスクロールページネーションのコード

4

1 に答える 1

1

まず最初に、html と php を混ぜてはならないコントローラについてのアドバイスをします。

したがって、このコードは

function display_friends()
    {
            $offset =       $this->input->post('page_num');     
            $find   =       $this->friends_model->find($offset);

            if($find->num_rows() > 0        )
            {
                    foreach($find->result() as $show)
                    {       ?>

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

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

            </div>
    <?php } } else { exit; }?>
            <!-- end image-box -->
            <div class="cl">&nbsp;</div>
            <?php          
    }

このメソッドの特定のビューを作成して、2 つに分割します。

function display_friends(){
    $offset = $this->input->get('page_num');//notice that we changed this to get     
    $find   = $this->friends_model->find($offset);

    if($find->num_rows() > 0)
    {
        $data['rows'] = $find->result();
        $this->load->view('new_view', $data);
    } 
    echo '<div class="cl">&nbsp;</div>'
}

そして new_view ファイルは次のようになります

   <?php foreach($rows as $show):?>

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

編集 プラグインに渡されたデータは、インスタンス化されたときに 1 回だけ渡された{page_num:$('.image-box').size()}ので、インスタンス化されたときに 6 であるため、オフセットは常に 6 です。

'contentPage': '<?=base_url()?>friends/display_friends', // 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,

1 つの解決策は、scrollpagination を編集し、投稿データまたは内部カウンターのセッターをクレートすることです。

于 2013-03-14T11:41:26.320 に答える