【问题标题】:Codeigniter jquery ajax paginationCodeigniter jquery ajax分页
【发布时间】:2011-09-18 03:57:29
【问题描述】:

我在这里得到一个教程 http://codeigniter.com/forums/viewthread/122597/P0/

一切都找到了,但不是分页链接。

这是我的代码

<script>
    ajax_paging = function()
    {
        $("p.pagination a").click(function() 
        {
            $.ajax({
            type: "GET",
            url: $(this).get(),
            success: function(html)
                     {
                         $("#display-content").html(html);
                     }
            });               
        });            
    return false;
    }; 
</script>

<?php 
    if($num_results == 0)
    {
        echo 'No data result, please insert one';
    }
    else
    {
?>
        <div id="display-content">
        <table width="100%">
        <tr>
            <th>CP code</th>
            <th>Code</th>
        </tr>
    <?php foreach($records as $row){ ?>
        <tr>
            <td align="center"><?php echo $row->created_date?></td>
            <td align="center"><?php echo $row->uid?></td>
        </tr>
    <?php }?>
</table>
 <p class="pagination">
 <?=$pagination?>
    </p>
    </div>
<?php } ?>

这里是分页 HTML

    <p class="pagination">
     &nbsp;<strong>1</strong>&nbsp;
<a onclick="javascript:ajax_paging();return false;" href="http://bravonet.my/tombocrm/inside/home_fpr/5">2</a>&nbsp;
<a onclick="javascript:ajax_paging();return false;" href="http://bravonet.my/tombocrm/inside/home_fpr/10">3</a>&nbsp;
<a onclick="javascript:ajax_paging();return false;" href="http://bravonet.my/tombocrm/inside/home_fpr/5">&gt;</a>&nbsp;    
</p>

当我尝试点击分页链接时,它只像普通链接一样工作。 javascript ajax 发生错误。

我的 JavaScript 很弱。任何帮助将不胜感激,并提前致谢。

【问题讨论】:

  • 尝试用以下代码替换url: $(this).get():url: $(this).attr('href')
  • 出现什么样的ajax错误?您应该显示错误以帮助找到解决方案。干杯!
  • 当我尝试点击分页链接时,javascript 无法正常工作。在我尝试了您的建议和 deczo 解决方案后,现在正在工作。非常TQ!!!

标签: jquery ajax codeigniter pagination


【解决方案1】:

在codeigniter中添加ajax分页非常容易

//AJAX PAGINATION || GEETING URL FROM ON CLICK PAGE NO. IN PAGINATION
$(function(){
  $(document).on('click', ".pages a",function(){  // LOAD ON PAGE LOAD AND ON CLICK
   var urls = $(this).attr("href");

   $.ajax({
   type: "POST",
   url: urls,
   data:"",
   success: function(res){
      $("#ajaxComment").html(res);  //SET COMPLETE RESPONCE VALUE IN DIV
   }
   });

 return false;
});

});

标题


【讨论】:

    【解决方案2】:

    1 jquery .get() 用于获取 DOM 元素,因此您在这里不需要它,并且在 $("p.pagination a").click() 引用标签中的 $(this) 就像在 r.piesnikowski 中一样评论用 $(this).attr('href') 替换 $(this).get()

    2 不要放 onclick="javascript:ajax_pagin();return false;"在您的标签中,而不是在您的标签中留下这个 sn-p(它将 onclick 事件处理程序添加到您的标签):

    $(document).ready(function(){
      $("p.pagination a").click(function() {
        $.ajax({
          type: "GET",
          url: $(this).attr('href'),
          success: function(html){
            $("#display-content").html(html);
          }
        });               
        return false;
      });            
    });
    

    3 在您的 js 代码中有一个错误 - return false 放错了位置,onclick 事件本身没有返回 false,ajax_pagin 确实如此,这就是链接正常工作的原因。

    【讨论】:

    猜你喜欢
    • 2012-12-21
    • 2020-01-26
    • 2013-09-07
    • 2017-04-08
    • 2023-03-25
    • 1970-01-01
    • 2014-03-08
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多