ajax分页2：jquery.pagination +JSON 动态无刷新分页

静态页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
body{font-size:84%; color:#333333; line-height:1.4;}
a{color:#34538b;}
#Searchresult{width:300px; height:100px; padding:20px; background:#f0f3f9;}
</style>

<link rel="stylesheet" href="<?php echo base_url();?>static/pagination.css" />
<script type="text/javascript" src="<?php echo base_url();?>static/jquery.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>static/jquery.pagination.js"></script>
<script type="text/javascript">

$(document).ready(function(){
       pageselectCallback(0);
       function pageselectCallback(page_index )
        {
            var limit = 5;
            var offset = page_index * limit;
            $.ajax({
                   url : '<?php echo site_url('test/ajax_page');?>',
                   async : false,
                   type : 'POST',
                   dataType : 'json',
                   data : "post_data=abc&limit="+ limit+"&offset="+offset,
                   beforeSend: function() {
                        $("#Searchresult").html("<p>Wait .......</p>");
                   },
                   success: function( data ){
                        var m_html = '';
                        if(data.ok == '1')
                            $(data.result).each(function(i,item){
                                m_html +=  item.catalog+' == '+item.name+" <br>";
                            })
                        $("#Searchresult").html(m_html);
                   }
             })
        }
           // 创建分页
           $("#Pagination").pagination( <?php echo $num;?>, {
                    num_edge_entries: 0,
                    num_display_entries: 6,
                    items_per_page: 5,
                    ellipse_text: " ",
                    link_to: '#&',
                    prev_text: '«PREV',
                    next_text: 'NEXT»',
                    callback: pageselectCallback
           });
    });  
       
</script>
</head>
<body>
    <div id="Pagination" class="pagination"  style="width:960px; height: 200px;"><!-- 这里显示分页 --></div>
<div id="Searchresult">分页初始化完成后这里的内容会被替换。</div>   
</body>
</html>

php:

public function ajax_page()
   {      
            $this->load->helper('url');
             $this->load->database('abgent_product');
            $arrs = $this->db->select("count(*) as num ")->get('abgent_products')->row_array();
            $data['num'] = $arrs['num'];
            if( $this->input->post('post_data') )
            {
                  $limit = $this->input->post('limit');
                  $offset = $this->input->post('offset');
                  $arr = $this->db->select("catalog,name")->limit($limit)->offset($offset)->get('abgent_products')->result_array();
                  $data['result'] = $arr ;
                  $data['ok'] = 1;
                  echo json_encode($data);
            }else{
                 $this->load->view('welcome_message',$data);
            }
            
    }