jQuery DataASP를 사용한 서버측 처리를 가능하게 합니다.NET Web Forms

jQuery DataASP를 사용한 서버측 처리를 가능하게 합니다.NET Web Forms

문제:

• jQuery DataASP를 사용한 서버측 처리를 가능하게 합니다.NET Web Forms.

솔루션:

• Darin Dimitrov는 페이지와 정렬을 예로 들어 질문에 답했지만 검색은 하지 않았습니다.다음은 그의 예제를 검색하기 위해 그의 작업을 **기본적으로 수정한 것입니다.

public class Data : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        // Paging parameters:
        var iDisplayLength = int.Parse(context.Request["iDisplayLength"]);
        var iDisplayStart = int.Parse(context.Request["iDisplayStart"]);

        // Sorting parameters
        var iSortCol = int.Parse(context.Request["iSortCol_0"]);
        var iSortDir = context.Request["sSortDir_0"];

        // Search parameters
        var sSearch = context.Request["sSearch"];

        // Fetch the data from a repository (in my case in-memory)
        var persons = Person.GetPersons();

        // Define an order function based on the iSortCol parameter
        Func<Person, object> order = person => iSortCol == 0 ? (object) person.Id : person.Name;

        // Define the order direction based on the iSortDir parameter
        persons = "desc" == iSortDir ? persons.OrderByDescending(order) : persons.OrderBy(order);

        // prepare an anonymous object for JSON serialization
        var result = new
                         {
                             iTotalRecords = persons.Count(),
                             iTotalDisplayRecords = persons.Count(),
                             aaData = persons
                                 .Where(p => p.Name.Contains(sSearch))  // Search: Avoid Contains() in production
                                 .Where(p => p.Id.ToString().Contains(sSearch))
                                 .Select(p => new[] {p.Id.ToString(), p.Name})
                                 .Skip(iDisplayStart)   // Paging
                                 .Take(iDisplayLength)
                         };

        var serializer = new JavaScriptSerializer();
        var json = serializer.Serialize(result);
        context.Response.ContentType = "application/json";
        context.Response.Write(json);
    }

    public bool IsReusable { get { return false; } }
}

public class Person
{
    public int Id { get; set; }
    public string Name { get; set; }

    public static IEnumerable<Person> GetPersons()
    {
        for (int i = 0; i < 57; i++)
        {
            yield return new Person { Id = i, Name = "name " + i };
        }
    }
}

나는 그 아이디어를 설명해야 할 간단한 예를 썼다.

우선 서버측에서 데이터를 처리하기 위한 범용 핸들러를 작성합니다(Data.ashx다만, 이것은, Web 페이지, Web 서비스, 또는 JSON 형식의 데이터를 반환할 수 있는 임의의 서버측 스크립트일 가능성이 있습니다).

public class Data : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        // Those parameters are sent by the plugin
        var iDisplayLength = int.Parse(context.Request["iDisplayLength"]);
        var iDisplayStart = int.Parse(context.Request["iDisplayStart"]);
        var iSortCol = int.Parse(context.Request["iSortCol_0"]);
        var iSortDir = context.Request["sSortDir_0"];

        // Fetch the data from a repository (in my case in-memory)
        var persons = Person.GetPersons();

        // Define an order function based on the iSortCol parameter
        Func<Person, object> order = p => 
        {
            if (iSortCol == 0) 
            { 
                return p.Id; 
            }
            return p.Name;
        };

        // Define the order direction based on the iSortDir parameter
        if ("desc" == iSortDir)
        {
            persons = persons.OrderByDescending(order);
        }
        else
        {
            persons = persons.OrderBy(order);
        }

        // prepare an anonymous object for JSON serialization
        var result = new
        {
            iTotalRecords = persons.Count(),
            iTotalDisplayRecords = persons.Count(),
            aaData = persons
                .Select(p => new[] { p.Id.ToString(), p.Name })
                .Skip(iDisplayStart)
                .Take(iDisplayLength)
        };

        var serializer = new JavaScriptSerializer();
        var json = serializer.Serialize(result);
        context.Response.ContentType = "application/json";
        context.Response.Write(json);
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

public class Person
{
    public int Id { get; set; }
    public string Name { get; set; }

    public static IEnumerable<Person> GetPersons()
    {
        for (int i = 0; i < 57; i++)
        {
            yield return new Person
            {
                Id = i,
                Name = "name " + i
            };
        }
    }
}

다음으로 Web Form:

<%@ Page Title="Home Page" Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head id="Head1" runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="/styles/demo_table.css" /> 
    <script type="text/javascript" src="/scripts/jquery-1.4.1.js"></script>
    <script type="text/javascript" src="/scripts/jquery.dataTables.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#example').dataTable({
                'bProcessing': true,
                'bServerSide': true,
                'sAjaxSource': '/data.ashx'
            });
        });
    </script>
</head>
<body>
    <form id="Form1" runat="server">
        <table cellpadding="0" cellspacing="0" border="0" class="display" id="example"> 
            <thead> 
            <tr> 
                <th>ID</th> 
                <th>Name</th> 
            </tr> 
            </thead> 
            <tbody> 
            <tr> 
                <td colspan="5" class="dataTables_empty">Loading data from server</td> 
            </tr> 
            </tbody> 
        </table>
    </form>
</body>
</html>

이 예는 지나치게 단순하지만, 나는 그것이 어떻게 주목받는가에 대한 기본을 설명해 주길 바란다.

열거된 예제 페이지는 실제로 초기화에 따라 정렬, 페이지 매기기, 필터링합니다.기본적으로 이러한 데이터는 쿼리 문자열을 통해 전달됩니다.

예를 들어 다음과 같습니다.

sAjaxSource": "../examples_support/server_processing.ashx?SortBy=FirstName&FilterBy=StackOverFlow"

그러나 일부 동작을 재정의하거나 dataTable의 기능을 확장하려면 다음과 같은 몇 가지 옵션이 있습니다.dataTable 기능 확장 스크롤 맞춤

위의 예에 따라 필터링, 정렬 및 페이지 매기기용으로 사용자 정의할 수 있습니다.

저는 ASP입니다.넷 개발자....net 개발자는 javascript 컨트롤이 아닌 .net 컨트롤을 사용하여 웹 페이지를 작성하는 데 사용됩니다.

다른 점은 asp.net 컨트롤은 서버 측 컨트롤이라는 것입니다.자신의 Javascript를 작성하지 않고 관리할 수 있지만 C#/VB.net에서 프로그래밍할 수 있습니다.asp.net 컨트롤은 웹사이트 실행 시 클라이언트 측 Javascript 컨트롤을 자동으로 생성합니다.

그것은 더 "현대적"이고 정말 강력합니다.

따라서 .net 개발자인 경우 이 방법을 사용하는 것이 좋습니다.Javascript 개발자로서 어플리케이션의 클라이언트측 인터페이스만을 구축하고 있는 경우 HTTP를 통해 호출 및 읽을 수 있는 XML 형식의 서버측 데이터를 제공하는 webService가 필요할 수 있습니다.다만, 「검색」을 실시하려면 , AJAX 를 개입시켜 「패지네이션」과 「소팅」을 실시할 필요가 있습니다.

이게 도움이 될까?http://www.codeproject.com/KB/aspnet/ASPNET_DataTable_to_JSON.aspx

http://naspinski.net/post/REAL-AJAX-with-AspNet-(not-AspNet-AJAX).aspx

이자는 에이잭스를 asp.net과 데이터 테이블과 함께 일하게 했습니다.

언급URL : https://stackoverflow.com/questions/3531438/jquery-datatables-server-side-processing-using-asp-net-webforms