jQuery Datentabellen serverseitige Verarbeitung mit ASP.NET WebForms

Question

Problem:

• jQuery Datentabellen serverseitige Verarbeitung mit ASP.NET WebForms.

Lösung:

• Darin Dimitrov beantwortet die Frage ein Beispiel welche Seiten und Sorten verwenden, aber führt keine Suche. Hier ist meine ** Grund ** Änderung seiner Arbeit zu machen, auf seinem Beispiel sucht Arbeit:

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

Ich schrieb ein einfaches Beispiel, das die Idee veranschaulichen sollte.

starten durch eine generische Behandlungsroutine das Schreiben von Daten auf der Server-Seite für den Umgang mit (Data.ashx aber eine Web-Seite, Web-Service sein könnte, etwas Server-Seite Skript der Lage, JSON formated Daten Rückkehr):

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

Und dann ein Webformular:

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

Das Beispiel stark vereinfacht ist, aber ich hoffe, dass es die Grundlagen zu veranschaulichen, wie starrte zu bekommen.

Answer 2

Ich bin asp.Net Entwickler ... Bitte nehmen Sie sich daran, dass Entwickler .net verwendet Web zu bauen Seiten mit .net-Steuerelementen, nicht mit JavaScript-Steuerelementen.

Der Unterschied ist: Ein asp.net Steuerelement ist ein serverseitiges Steuerelement, Sie verwalten es, ohne JavaScript selbst zu schreiben, aber in C#/VB.net zu programmieren. Das asp.net-Steuerelement generiert automatisch das clientseitige JavaScript-Steuerelement, wenn die Website ausgeführt wird.

Es Ansatz ist "moderner" und wirklich mächtig.

Wenn Sie also ein .net-Entwickler sind, empfehle ich Ihnen, diesen Ansatz zu verwenden. Wenn Sie ein JavaScript-Entwickler sind und nur die clientseitige Schnittstelle Ihrer Anwendung erstellen, benötigen Sie wahrscheinlich einen webService, der serverseitige Daten im XML-Format bereitstellt, die Sie über HTTP aufrufen und lesen können. Aber um zu "suchen", "Paginierung" und "Sortierung" über AJAX bereitzustellen, müssen Sie serverseitige ...

Answer 3

Vielleicht könnte das helfen? http://www.codeproject.com/KB/aspnet/ASPNET_DataTable_to_JSON.aspx

Answer 4

Die Beispielseiten, die Sie aufgelistet haben, sortieren, paginieren, filtern bei der Initialisierung. Grundsätzlich übergeben Sie diese Daten über eine Abfragezeichenfolge.

Etwas wie:

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

gesagt haben, dass, wenn Sie ein bestimmtes Verhalten außer Kraft setzen wollen oder Datatable des functionaly, Sie haben ein paar Optionen erweitern: Extending dataTable functionalityCustomizing Scrolling

Sie können folgen Sie den obigen Beispielen und passen sie zum Filtern, Sortieren und Paginierung

Answer 5

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

Dieser Typ hat Ajax mit asp.net und Databases arbeiten.