I am trying to implement the grid with remote paging by using the MVC wrappers to configure the Grid Model in my controller and pass it to the view. When the grid attempts to render, the View throws an exception "the DataSource must implement IQueryable". My data source does implement IQueryable. Can someone provide me with an example of what the data source needs to look like and what exactly should it be returning (Json, object, some other type)?
Thanks,
Mike
Hi Dave,
Please find the attached MVC project with igGrid. I hope it helps you see what is the issue with your project. You can pay attention how the data for the grisd implements IQueryable:
public ActionResult Index() { return View(this.GetProducts().AsQueryable()); }
I also suggest to have a look at the following resources:
http://www.igniteui.com/help/iggrid-developing-asp-net-mvc-applications-with-iggrid
Please let me know if you have some questions, I will be glad to help.
Thank you for your help. I was able to get the paging working with providing an IQueryable to the grid. However, I now am having a problem with doing filtering. Because of the requirements we have been given, the filtering criteria are in a partial form outside of the grid. So I am trying to submit the filtering criteria (along with the paging information) through an AJAX call. But when the grid renders the results, it is not showing the correct number of records (even though when I step through the code it has the correct data). I'm not sure if I am rebinding the data correctly. Please look at the code below and let me know if you have any suggestions. If you could reply to me at mlipkowitz@epic-premier.com I would really appreciate it.
Thank you.
[HttpGet]
public ViewResult Dashboard()
{
var user = (Employee)(HttpContext.Session["CurrentUser"]);
ActivityFilterViewModel filter = new ActivityFilterViewModel();
filter.States = PortalSession.States;
filter.Campaigns = PortalSession.Campaigns;
filter.Categories = PortalSession.Categories;
filter.Programs = PortalSession.Programs;
filter.NSM_Employees = PortalSession.Employees;
filter.NSM_Employee_Entity_ID = user.Entity_ID;
filter.NSM_Employee = user.Entity_Name;
ViewBag.FilterViewModel = filter;
return View(this.GetGridModel());
}
public JsonResult GetData(ActivityFilterViewModel criteria)
if (criteria.NSM_Employee_Entity_ID == null)
criteria.NSM_Employee_Entity_ID = user.Entity_ID;
int page_In = criteria.Page == 0 ? 1 : criteria.Page;
int pageSize_In = criteria.PageSize == 0 ? 10 : criteria.PageSize;
criteria.DateFrom = System.DateTime.Now.AddDays(-30);
criteria.DateTo = System.DateTime.Now.AddDays(30);
int recordCount = 0;
GridModel gridModel = GetGridModel();
ActivityRepository ar = new ActivityRepository();
gridModel.DataSource = ar.GetDashboardActivities(criteria, page_In, pageSize_In, out recordCount).AsQueryable();
ActivityGridResultsModel results = new ActivityGridResultsModel();
if (recordCount > 0)
results.Records = ((List<ActivityGridViewModel>)HttpContext.Session["ActivityDashboard"]).AsQueryable();
results.TotalRecordsCount = recordCount;
else
results.Records = Enumerable.Empty<ActivityGridViewModel>().AsQueryable();
JsonResult dataResults = new JsonResult();
dataResults.Data = results;
dataResults.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
return dataResults;
private GridModel GetGridModel()
string dataSourceUrl = "/Activity/GetData";
string gridID = "EmployeeActivityGrid";
Grid grid = new Grid();
GridModel gridModel = grid.SetupGrid(new ActivityGridViewModel(), dataSourceUrl, gridID);
return gridModel;
JavaScript Code:
$(document).ready(function () {
var globalAppRoot = "/"; var requestedPage; var requestedPageSize; $('#submitFilter').button();
$('#submitFilter').click(function (e) { e.preventDefault(); requestedPage = 0; requestedPageSize = $('#EmployeeActivityGrid').igGridPaging('option', 'pageSize'); submitFilter(requestedPage, requestedPageSize); });
function submitFilter(requestedPage, requestedPageSize) { var filterData = $('#activityFilterForm').serializeArray(); filterData.push({ name: 'page', value: requestedPage }, { name: 'pageSize', value: requestedPageSize }) var filterPosting = $.ajax({ url: globalAppRoot + 'Activity/GetData', data: filterData, dataType: 'json', });
filterPosting.done(function (data) { $("#EmployeeActivityGrid").igGrid("dataBind"); }) };
});
Hi,
Thank you for the code shared. However I was not able to integrate it in my project due to some missing DOM elements, variables, etc. I cannot assume what each missing is expected to be so I think it is better if you could send me your sample, or modify mine to reproduce the issue you are having. Then I will be able to investigate and suggest accordingly.
Looking forward to hearing from you.
I'm just following up to see if you had the time to provide the required information or a working sample reproducing the issue.