Виртуальный ListView для ASP.net?

Есть ли виртуальный список для ASP.net?

Большинство таблиц (и сеток, списков, таблиц данных, сеток данных, представлений сеток, сеток списков), которые я нахожу для asp.net, ожидают, что пользователь просматривает данные.

я хочу список, который содержит, например, 10000 элементов; и я не хочу 10 страниц.

Проблема длинного списка была решена в 1994 году с использованием списка в "виртуальном" режиме. Для контроля нужно указать только количество предметов, которые нужно показать. Управляющая информация об этих элементах по мере необходимости (т. Е. Когда пользователь прокручивает их в поле зрения или пытается отсортировать по столбцу).

Кто-нибудь создал виртуальный просмотр списка (предположительно, используя асинхронный Javascript и XML или синхронный Javascript и XML)?

Если ответ "нет": не бойтесь отвечать на вопрос. Там нет ничего плохого в ответе:

Нет.

Источник

2 ответа

Я просто делаю один виртуальный образец ListView.

Я начинаю с повторителя, который я отрисовываю, с атрибутом, который содержит идентификатор базы данных, который нужно загрузить.

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

Затем JavaScript, который проверяет, является ли этот div видимым, и получает данные, используя ajax.

<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

Источник

Попробуйте взглянуть на jQuery плагин с бесконечной прокруткой. Я думаю, что это то, что вы ищете.

Источник
Другие вопросы по тегам