jquery - Asp.net mvc dropdownlist 添加滚动项

标签 jquery asp.net-mvc drop-down-menu scrollbar

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

滚动事件传递到 Controller ,获取记录并附加到下拉列表的最后一项。我认为任何建议都可以让我理解如何处理代码逻辑

Here is what I tried to append to dropdown

<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调用 Controller 并获取记录然后绑定(bind)到下拉列表的代码

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/每当滚动结束时将静态数据添加到下拉列表的示例

关于jquery - Asp.net mvc dropdownlist 添加滚动项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21302989/

相关文章:

php - 设置 PHPSESSID Cookie、CORS

javascript - 从下拉菜单中选择某个选项时如何显示警报

javascript - 使 Wordpress 主题下划线下拉菜单在单击外部时关闭

javascript - 如何在下拉选择中禁用某些选项?

javascript - 这个 asp.net web 用户控制代码有什么问题?

javascript - jQuery scrollTop() 方法不起作用

javascript - 仅从下拉列表中获取选定的值并从下拉列表中删除未选定的值

c# - 在特定条件下显示错误消息(空列表)

asp.net-mvc - Html.BeginForm() 工作正常, Html.BeginForm ("action","controller")忽略 [AllowHtmlAttribute]

.net - ASP.Net MVC4 WebApi 代理