معالجة جانب الخادم jQuery DataTables باستخدام ASP.NET WebForms

Question

مشكلة:

• JQuery Datatables معالجة Server-Side باستخدام ASP.NET WebForms.

المحلول:

• أجاب دارين ديميتروف على السؤال باستخدام مثال على الصفحات والفرز ، لكنه لا يقوم بأي بحث. إليك تعديل ** ** ** لعمله لجعل العمل البحث على مثاله:

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 };
        }
    }
}

Answer 1

كتبت مثالًا بسيطًا يجب أن يوضح الفكرة.

ابدأ بكتابة معالج عام لمعالجة البيانات على جانب الخادم (Data.ashx ولكن قد تكون هذه صفحة ويب ، خدمة ويب ، أي شيء نصي جانب خادم قادر على إرجاع بيانات 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
            };
        }
    }
}

ثم webform:

<%@ 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>

المثال مبالغ فيه ، لكنني آمل أن يوضح الأساسيات حول كيفية التحديق.

Answer 2

مثال الصفحات التي أدرجتها في الواقع فرز ، تراجع ، تصفية على التهيئة. في الأساس ، يمكنك تمرير هذه البيانات عبر سلسلة الاستعلام.

شيء مثل:

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

بعد قولي هذا ، إذا كنت ترغب في تجاوز بعض السلوك أو ترغب في تمديد وظيفة Datatable ، فلديك بعض الخيارات: تمديد وظائف DataTable تخصيص التمرير

يمكنك متابعة الأمثلة أعلاه وتخصيصها للتصفية والفرز والترقيم

Answer 3

أنا مطور ASP.NET ... يرجى الأخذ في الاعتبار أن مطوري .NET يستخدمون لإنشاء صفحات الويب باستخدام عناصر التحكم .NET ، وليس عناصر التحكم في JavaScript.

الفرق هو: عنصر تحكم ASP.NET هو عنصر تحكم من جانب الخادم ، يمكنك إدارته دون كتابة JavaScript نفسك ، ولكن البرمجة في C#/VB.NET. يقوم عنصر التحكم ASP.NET تلقائيًا بإنشاء التحكم JavaScript من جانب العميل عند تشغيل الموقع.

إنه نهج هو أكثر "حديثًا" وقويًا حقًا.

لذلك إذا كنت مطور .NET ، أقترح عليك استخدام هذا النهج. إذا كنت مطور JavaScript وقمت بإنشاء واجهة من جانب العميل فقط لتطبيقك ، فربما تحتاج إلى خدمة ويب توفر بيانات من جانب الخادم بتنسيق XML الذي يمكنك الاتصال به وقراءته عبر HTTP. ولكن ، إلى "البحث" ، توفير "ترقيم" و "فرز" عبر AJAX ، تحتاج إلى تطوير جانب الخادم ...

Answer 4

ربما هذا يمكن أن يساعد؟ http://www.codeproject.com/kb/aspnet/aspnet_datatable_to_json.aspx

Answer 5

http://naspinski.net/post/real-ajax-with-aspnet-(not-aspnet-ajax).aspx

لقد جعل هذا الرجل AJAX يعمل مع ASP.NET و DATATABLES.