每次滚动时如何获得动态表的每25行记录(在页面加载时它是1-25条记录然后是25-50条)

时间:2013-11-21 04:28:16

标签: jquery html asp.net

每次滚动

时,如何获得25行记录并动态地将它们放在表格中
<div class="UserList">
    <table id="tblUsers"></table>
</div>

我有一些JQuery客户端代码来请求像这样的数据

$(".UserList").scroll(function () {

    var iframe = $(".UserList");
    var tr = iframe.contents().find("tr[name=25]");

    $.ajax({
        type: "POST",
        url: "UserListing.aspx/GetNRecods",
        data: '{Lower:' + tr + ',Upper: ' + tr + '}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            $("#tblUsers").html(data.d);
        }
    });`

我的后端代码是

<System.Web.Services.WebMethod()> _
Public Shared Function GetNRecords(ByVal Upper As Integer, ByVal Lower As Integer) As String

    Dim oUserinfo As New ClassUser
    Dim dvUserlist As New DataView
    dvUserlist = oUserinfo.GetNRecords(Upper, Lower)
    Dim strData As String

    strData = "<tr id='Header'><td>UserID</td><td>UserName</td><td>Created Date</td><td>Email</td><td>FirstName</td><td>LastName</td><td>Mobile No.</td><td>Address</td><td>Country</td><td colspan='2'>Action</td><td>Status</td></tr>"

    For i As Integer = 0 To dvUserlist.Table.Rows.Count - 1
        Dim Txt As String
        Txt = CStr(dvUserlist.Table.Rows(i)("IsActive").ToString())

        If Txt = False Then
            Txt = "Inactive"
        Else
            Txt = "Active"
        End If

        strData += "<tr><td id='userID'>" + dvUserlist.Table.Rows(i)("userID").ToString() + "</td><td id='UserName'>" + dvUserlist.Table.Rows(i)("username").ToString() + "</td><td id='Date'>" + CDate(dvUserlist.Table.Rows(i)("CreatedDate").ToString()).ToString("dd/MM/yyyy") + "</td><td id='Email'>" + dvUserlist.Table.Rows(i)("Email").ToString() + "</td><td id='FirstName'>" + dvUserlist.Table.Rows(i)("FirstName").ToString() + "</td><td id='LastName'>" + dvUserlist.Table.Rows(i)("LastName").ToString() + "</td><td id='Phone'>" + dvUserlist.Table.Rows(i)("Phone").ToString() + "</td><td id='Address'>" + dvUserlist.Table.Rows(i)("Address").ToString() + "</td><td id='Country'>" + dvUserlist.Table.Rows(i)("country").ToString() + "</td><td id='Edit'> <a id='lnkEdit'" & dvUserlist.Table.Rows(i)("userID").ToString() & "' onclick='window.open(""InsertUserInfo.aspx?userid=" & dvUserlist.Table.Rows(i)("userID").ToString() & """)'> Edit </a>" + "</td><td id='Delete'> <a id='LnkDelete'" & dvUserlist.Table.Rows(i)("userID").ToString() & "' onclick='DeleteUserinfo(""" & dvUserlist.Table.Rows(i)("userID").ToString() & """);'>Delete</a></td><td><span class='IsActive' id='IsActive" & dvUserlist.Table.Rows(i)("userID").ToString() & "' onclick='UpdateUserStatus(" & dvUserlist.Table.Rows(i)("userID").ToString() & ")'>" + Txt + "</span></td></tr>"

        Next
    Return strData
End Function

1 个答案:

答案 0 :(得分:1)

我的HTML是

<div class="UserList">

           <table id="tblUsers">

           </table>

            </div>

jquery代码

var startRow = 1;

              var endRow = startRow + 24;

               $.ajax({

             type: 'POST',

              url: "UserListing.aspx/GetNRecords",

             data: '{strSearch: ' + "'" + $("#txtSearch").val() + "'" + ',Lower: ' + startRow + ' ,Upper: ' + endRow + '}',

              contentType: "application/json; charset=utf-8",

                  dataType: "json",

                success: function (data) {

                 $("#tblUsers").append(data.d);

                  $("#tblUsers").prepend("<tr id='Header'><td>UserID</td>                      
                  <td>UserName</td><td>Created Date</td><td>Email</td>                      
                 <td>FirstName</td><td>LastName</td><td>Mobile No.</td>
                 <td>Address</td><td>Country</td><td colspan='2'>Action</td>
                 <td>Status</td></tr>");

                $(".UserList").bind("scroll", function () {

                GetUserOnScroll();

                });
        }
    });
       **backend serverside webservice method code is**



        <System.Web.Services.WebMethod()> _                                            
        Public Shared Function GetNRecords(ByVal strSearch As String, ByVal Lower   
        As Integer, ByVal Upper As Integer) As String

           Dim oUserinfo As New ClassUser

           Dim dvUserlist As New DataView

        dvUserlist = oUserinfo.GetNRecords(strSearch, Lower, Upper)

          Dim strData As String

         strData = "<tr style='display:none'><td><span id='UserCount'>" + 

            dvUserlist.Table.Rows(0)("UserCount").ToString() + "</span></td></tr>"

          For i As Integer = 0 To dvUserlist.Table.Rows.Count - 1

                Dim Txt As String

               Txt = CStr(dvUserlist.Table.Rows(i)("IsActive").ToString())

               If Txt = False Then

               Txt = "Inactive"

                    Else

                 Txt = "Active"

                 End If

                    strData += "<tr><td class='userID'>" + dvUserlist.Table.Rows(i)
                      ("userID").ToString() + "</td><td class='UserName'>" + 
                          dvUserlist.Table.Rows(i)("username").ToString() + "</td>                 
                            <td class='Date'>" + CDate(dvUserlist.Table.Rows(i)
                       ("CreatedDate").ToString()).ToString("dd/MM/yyyy") + "</td>
                       <td class='Email'>" + dvUserlist.Table.Rows(i)
                       ("Email").ToString() + "</td><td class='FirstName'>" +      
                             dvUserlist.Table.Rows(i)("FirstName").ToString() + "
                            </td><td class='LastName'>" + dvUserlist.Table.Rows(i)
                            ("LastName").ToString() + "</td><td class='Phone'>" + 
                            dvUserlist.Table.Rows(i)("Phone").ToString() + "</td>
                                  <td class='Address'>" + dvUserlist.Table.Rows(i)
                             ("Address").ToString() + "</td><td class='Country'>" + 
                              dvUserlist.Table.Rows(i)("country").ToString() + "
                              </td><td id='Edit'> <a class='lnkEdit'" & 
                              dvUserlist.Table.Rows(i)("userID").ToString() & "'  
                             onclick='window.open(""InsertUserInfo.aspx?userID=" & 
                               dvUserlist.Table.Rows(i)("userID").ToString() & 
                                    """)'> Edit </a>" + "</td><td class='Delete'> 
                               <a id='LnkDelete'" & dvUserlist.Table.Rows(i)
                             ("userID").ToString() & "' onclick='DeleteUserinfo(""" 
                               & dvUserlist.Table.Rows(i)("userID").ToString() & 
                                   """);'>Delete</a></td><td><span class='IsActive' 
                              id='IsActive" & dvUserlist.Table.Rows(i)
                                 ("userID").ToString() & "' 
                              onclick='UpdateUserStatus(" & 
                                 dvUserlist.Table.Rows(i)("userID").ToString() & 
                               ")'>" + Txt + "</span></td></tr>"

                                 Next


                            Return strData

                           End Function