I am trying to load more records on click via ajax, in my asp.net mvc5 web application. But I am new to javascript and I can't figure out how to hide load more button when current page is equal to total pages.

我试图在我的asp.net mvc5 Web应用程序中通过ajax加载更多记录。但我是javascript的新手,当当前页面等于总页数时,我无法弄清楚如何隐藏加载更多按钮。

javascript code:

function LoadMoreUR(total_pages) {
    loadRecords(total_pages);
}
var page = 0;
var _inCallback = false;
function loadRecords(total_pages) {
    if (page > -1 && !_inCallback) {
        _inCallback = true;
        page++;
        $('div#loading').html('<p><img src="/Content/loading.gif"></p>');
        $.get("/UserReviews/@ViewData["DeviceID"]/" + page, function (data) {
            if (data != '') {
                $("#UserReviewsList").append(data);
            }
            else {
                page = -1;
            }

            _inCallback = false;
            $('div#loading').empty();
        });
    }
}

My View

    <div id="UserReviewsList">
        @Html.Partial("_user_reviews")
    </div>
    <div id="loadingbtn">
        <button class="btn btn-primary" id="LoadMUR" onclick="LoadMoreUR(@ViewData["TotalPages"])" >Load More</button>
        <div id="loading"></div>
    </div>

If there are 3 records for a device, and I am loading one record on each click. I want to hide loadingbtn div when page is equal to total_pages.

如果设备有3条记录,我每次点击都会加载一条记录。当页面等于total_pages时,我想隐藏loadingbtn div。

Please help me figure this out. Thanks

请帮我解决这个问题。谢谢

My Solution (please tell me if I am doing something wrong)

我的解决方案(如果我做错了,请告诉我)

function LoadMoreUR(totalpages) {
    loadProducts(totalpages);
}
var page = 0;
var _inCallback = false;
function loadProducts(totalpages) {
    if((page + 2) == totalpages && !_inCallback)
    {
        $('div#loading1').empty();
    }
    if (page > -1 && !_inCallback) {
        _inCallback = true;
        page++;
        $('div#loading').html('<p><img src="/Content/loading.gif"></p>');
        $.get("/UserReviews/Index/@ViewData["DeviceID"]/" + page, function (data) {
            if (data != '') {
                $("#UserReviewsList").append(data);
            }
            else {
                page = -1;
            }

            _inCallback = false;
            $('div#loading').empty();
        });
    }
}

1 个解决方案

#1


2

In Ajax response you have to get whole records count and Compare with displayed records. If you are binding in table you can get count of rows.

在Ajax响应中,您必须获得整个记录计数并与显示的记录进行比较。如果您在表中绑定,则可以获得行数。

var rowCount = $('#myTable tr').length;

In ajax response return the number of records each time to check condition to hide the button.

在ajax响应中返回每次检查条件的数量以隐藏按钮。

If(rowCount == TotalRecordCount )
{
 $("#loadingbtn").hide()
}

更多相关文章

  1. 利用javascript动态加载头部出现点击事件与hover事件无效解决方
  2. JS在页面加载时候onload与匿名自调用函数的区别
  3. 如何更改我的按钮文字?
  4. 单选按钮单击,隐藏/显示不工作
  5. 在Internet Explorer中使用sprited按钮和selection.createRange()
  6. 如何在角度js中每5秒重新加载网格?
  7. 如何在点击时动态加载/播放/暂停多源HTML5音频?
  8. 每次在HTML5中加载静态图像
  9. Angularjs - NgTable在重新加载时未定义

随机推荐

  1. 【图解数据结构】 一组动画彻底理解快速
  2. 每天一算:Evaluate Reverse Polish Notati
  3. 每天一算:Remove Linked List Elements
  4. 【图解数据结构】 一组动画彻底理解插入
  5. 每天一算:Binary Tree Preorder Traversal
  6. 每天一算:Swap Nodes in Pairs
  7. ubuntu 编译 Android(安卓)出现的若干错
  8. 每天一算:二叉树的中序遍历
  9. 每天一算:Partition List
  10. 【图解数据结构】 一组动画彻底理解计数