虚拟列表视图的ASP.net?(Virtual Listview for ASP.net?)

2019-06-25 10:34发布

是否有ASP.net虚拟列表视图?


大多数表(和网格,列表视图,数据表,数据网格,网格视图,列表网格),我找到asp.net期望通过数据用户页面。

我想,包含,一个ListView例如,1万件; 我不希望10页。

一长串的问题是使用“虚拟”模式,一个ListView在1994年得到解决。 控制只需要给予项目显示的数量。 根据需要对这些项目的控制信息(即,随着用户滚动它们变成图,或尝试进行排序上的列)。

有没有人创建了(大概是使用异步JavaScript和XML,或同步JavaScript和XML)的虚拟列表视图?


如果答案是“不”:不要害怕回答这个问题。 这没有什么错的答案:

没有。

Answer 1:

我只是做一个虚拟的ListView样品。

我开始与我的div渲染,与包含数据库的ID需要加载一个属性的中继器。

<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
        <div data-id="<%# GetID(Container.DataItem) %>" class="DataLine"> 
        loading...
        </div>
    </ItemTemplate>
</asp:Repeater>

接下来是检查这个div是可见的,并使用AJAX获取数据的JavaScript。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

<script>
function isScrolledIntoView(elem)
{
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();

    var elemTop = elem.offset().top;
    var elemBottom = elemTop + elem.height();

    return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
}

var cTimerID = null;
function RunWithSomeDelay()
{
    if(cTimerID) 
        clearTimeout(cTimerID);

    cTimerID = setTimeout(CheckWhatToShow, 1000);
}

function CheckWhatToShow()
{
    $(".DataLine").each(function(i, selected) {

        var ThisOne = $(selected);

        if(ThisOne.attr("Done") != "1")
        {
            if(isScrolledIntoView(ThisOne))
            {                   
                ThisOne.attr("Done", "1");
                // here you can use a simple ajax load, to load your data.
                ThisOne.text(ThisOne.attr("data-id"));
            }
        }
    });
}

$(document).ready(function() {  
    // first time run
    CheckWhatToShow();
    // run on scrool
    $(window).scroll(RunWithSomeDelay);
}); 

</script>

这里是为后面的测试,一个我的代码

public partial class Dokimes_StackOverFlow_VirtualList : System.Web.UI.Page
{
    List<int> oMainIds = new List<int>();

    protected void Page_Load(object sender, EventArgs e)
    {
        for (int i = 0; i < 3000; i++)            
            oMainIds.Add(i);            

        Repeater1.DataSource = oMainIds;
        Repeater1.DataBind();
    }

    public int GetID(object oItem){
        return (int)oItem;
    }
}

我测试和它的工作只是找到。

这里是源代码: http://www.planethost.gr/VirtualList.rar

可以做的改进:

  • 为了优化什么div来搜索上的滚动点知名度基地。
  • 要加载的一组数据并将它们放在div的

更新我做了一些优化速度,并添加AJAX调用测试。 对于这种优化工作更正所包含的数据必须在整个网页上使用相同的div的高度。 左装载一组数据,让他们为JSON并把他们放在正确的位置。

http://www.planethost.gr/VirtualList2.rar



Answer 2:

尝试看看无限滚动的jQuery插件 。 我认为这是它就像你在寻找的。



文章来源: Virtual Listview for ASP.net?