ASP.NET MVC DropdownList在滚动时添加项目 [英] Asp.net mvc dropdownlist add items on scrolling

问题描述

我正在寻找asp.net mvc下拉列表，如果滚动滚动条，它可以添加记录.我完全是这个领域的初学者.能否有人指导我如何实现此代码或任何可重用的代码，例如

I am looking for asp.net mvc dropdown list which can adds records if scrollbar is scrolled. I am completely beginner to this area. Could some one guide me on how to implement this or any reusable code such as

滚动事件带到控制器，获取记录并追加到下拉菜单的最后一项.我认为任何建议都可以使我理解如何处理代码逻辑

Scroll event takes to controller,get records and append to dropdown last item. I think any suggestion could make me understand how to deal with code logic

这是我尝试添加到下拉列表中的内容

<select>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>8</option>
    <option>9</option>
    <option>10</option>
    <option>11</option>
</select>

推荐答案

jQuery代码

下面是使用ajax调用控制器并获取记录然后绑定到下拉列表的代码

Below is the Code for using ajax call to controller and get records then bind into to dropdown

var mySelect = $('#mySelect');
 var sIndex = 11, offSet = 10, isPreviousEventComplete = true, isDataAvailable = true;

    mySelect.scroll(function (e) {
   if($(this).scrollTop() + $(this).innerHeight()>=$(this)[0].scrollHeight)
   {   
       var scrollto=$(this).scrollTop();
       if (isPreviousEventComplete && isDataAvailable) {       
          isPreviousEventComplete = false;
        $(".LoaderImage").css("display", "block");

        $.ajax({
          type: "GET",
          url: 'Your url',
          success: function (result) {
                   $.each(result, function(val, text) {            
    mySelect.append(
        $('<option></option>').val(val).html(text)
    );
        });
           mySelect.scrollTop( scrollto );

            isPreviousEventComplete = true;

            if (result == '') //When data is not available
                isDataAvailable = false;

            $(".LoaderImage").css("display", "none");
          },
          error: function (error) {
              alert(error);
          }
        });


      }
               }
    });

点击演示链接 http://jsfiddle.net/sethuramanP/4pmKf/3/滚动结束时将静态数据添加到下拉列表的示例

Click Demo Link http://jsfiddle.net/sethuramanP/4pmKf/3/ example for add static data to dropdown whenever scroll comes end

这篇关于ASP.NET MVC DropdownList在滚动时添加项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！