Creating the postbacks

Postbacks are created by instantiating the WebExtras.JQDataTables.PostBackItem class. Postbacks are always created in the HTTP POST handler of our search method. Let's say that our post back handler entity class is as follows:

  // Note that this needs to be an entity class, i.e it must only contain .NET base types
  public class PostbacksSearchModel
  {
    public string FirstColumn { get; set; }
    public string SecondColumn { get; set; }
  }
  

    // Let's create the postback entity model and populate with user inputs
    PostbacksSearchModel postbacks = new PostbacksSearchModel
    {
      FirstColumn = // Set this with form element value
      SecondColumn = // Set this with form element value
    }

    // There are two ways of creating postbacks
    // Method 1: Manually adding key value pairs
    List<PostbackItem> dtPostbacks = new List<PostbackItem>();
    
    if (!string.IsNullOrEmpty(postbacks.FirstColumn))
      dtPostbacks.Add(new PostbackItem("FirstColumn", postbacks.FirstColumn));

    if (!string.IsNullOrEmpty(postbacks.SecondColumn))
      dtPostbacks.Add(new PostbackItem("SecondColumn", postbacks.SecondColumn));

    // This is a little tedious since we only want to add non null values to our postback
    // Method 2: Have the postbacks created for you from an object
    IEnumerable<PostbackItem> dtPostbacks = PostbackItem.FromObject(postbacks);
  

Note that the FromObject method will only look at the public properties of the given model and ignore any type that is not a .NET base type

A slightly updated constructor definition for our datatable

Now that we have added some postbacks, we need to setup our datatable to be able to handle some postbacks. So we have a slightly modified constructor for our datatable

  Datatable dTable = new Datatable("postbacks-table", dtSettings, null, dtPostbacks);    
  

Notice that we are not passing in any datatable records. We are just leaving them as null.

That's the HTTP POST handler

  public Datatable PostHandler(PostbacksSearchModel model)
  {    
    IEnumerable<AOColumn> dtColumns = new AOColumn[]
    {
      new AOColumn("First Column"),
      new AOColumn("Second Column")
    };

    IEnumerable<PostbackItem> dtPostbacks = PostbackItem.FromObject(model);
    DatatableSettings dtSettings = new DatatableSettings(
      5, 
      dtColumns,
      new AASort(0, SortType.Ascending), 
      "~/getpostbackdata", 
      "searched/filtered records", 
      "150px");
    Datatable dTable = new Datatable("postbacks-table", dtSettings, null, dtPostbacks); 
  }
  

You might wonder where the search actually happens since it is not apparent from the code. You are right, the search is not really happening here. This method only creates the skeleton for the view to be displayed to the user.

An AJAX handler does the grunt work

In the HTTP POST handler we have said that we want the AJAX handling to be done at the URL: "~/getpostbackdata". So let's now create this AJAX handler. This is where the grunt work of actually filtering/searching happens...

  public DatatableRecords GetPostbackData(DatatableFilters filters, PostbacksSearchModel postbacks)
  {
    string[][] dtData = new string[][]
    {
      new string[] { "first column row 1", "second column row 1" },    
      new string[] { "first column row 2", "second column row 2" },
      new string[] { "first column row 3", "second column row 3" },
      new string[] { "first column row 4", "second column row 4" }
    };

    // Here is our searcher logic
    // You can hook in you search/filter business logic here
    if (!string.IsNullOrEmpty(postbacks.FirstColumn))
      dtData = dtData.Where(f => f[0].ContainsIgnoreCase(postbacks.FirstColumn));
    if (!string.IsNullOrEmpty(postbacks.SecondColumn))
      dtData = dtData.Where(f => f[1].ContainsIgnoreCase(postbacks.SecondColumn));

    DatatableRecords dtRecords = new DatatableRecords
    {
      sEcho = filters.sEcho,
      iTotalRecords = dtData.Count(),
      iTotalDisplayRecords = dtData.Count(),
      aaData = dtData
    };

    return dtRecords;
  }
  

The default table

We will be searching records based on this table

Go ahead try it yourself

First column

Second column

Submit