How to sort the order of the table by the onclick of the heading of the table using web grid in ASP.NET MVC?

Question

I would like to sort the order of the table by the onclick on the heading of the column (Link). The code is as below,

enter image description here

Controller Code

  public ActionResult StockStatus(int? id)
        {
            List data = new List();
            if (id.HasValue)
            {
                data = db.Items.Where(d => d.InStock.Value  d.ItemName).ToList();
                ViewBag.LesserThan = id;
            }
            else
            {
                data = db.Items.OrderBy(d => d.ItemName).ToList();
            }

            return View(data);
        }
        public ActionResult StockStatus(int id)
        {
            var sold = db.Sales.Include(d => d.Items).Include(d => d.Customers).Where(d => d.ItemId == id).OrderByDescending(d => d.InvoiceId).ThenBy(d => d.Items.ItemName).ToList();
            return View(sold);
        }

Can any one of you please help me in this!!

Answer 1

You have next options:

1. Use client-side (Javascript) filtering\sorting. In this case use some controls like jqgrid, jgrid, etc which has this functionality(preferable) or implement your own.
2. Server side. Extend your controllers, to take additional string "order_by" and string "order_field" parameters and refactor your db queries considering this parameters. Add ajax calls on clicking headers for calling actions in controllers.( If you have webapi in your project you can just simply replace grid with new one, returned in ajax response)

Hope this helps!

Answer 2

you can call action method using action link below

grid.Column(
  header: "Qty In stock",
  columnName: "qty",
  format: (item) => new HtmlString(Html.ActionLink(Html.ActionLink("Sort", "Sortstock", new { Id = item.idAddress,sort="fieldname"})
  ) 

if u get the column name inside the action method you can sort the list

   public ActionResult Sortstock(string sort= "", string sortdir="")
   {
       List<Item> stocks = Student.getStock();
       IQueryable<Item> stud = SortIQueryable<Item>(Student.getStock().AsQueryable(), sort, sortdir);

       return View(stud);
   }


    public static IQueryable<T> SortIQueryable<T>(IQueryable<T> data, string fieldName, string sortOrder)
    {
        if (string.IsNullOrWhiteSpace(fieldName)) return data;
        if (string.IsNullOrWhiteSpace(sortOrder)) return data;

        var param = Expression.Parameter(typeof(T), "i");
        Expression conversion = Expression.Convert(Expression.Property(param, fieldName), typeof(object));
        var mySortExpression = Expression.Lambda<Func<T, object>>(conversion, param);

        return (sortOrder == "desc") ? data.OrderByDescending(mySortExpression) : data.OrderBy(mySortExpression);
    }