The grid works fine when i specify the columns explicitly.

My action method Users/GetUsers returns Json data.

When i used Jquery to implement autogeneratecolumns(true) , the grid rendered the data but i could not get the pageSize & pageIndex properties in my GridDataSource Action method. When i use MVC Helper , i get the pageSize PageIndex parameters but autogeneratecolumns does not work. Please help me out here.

This is the code which I wrote to render the grid using MVC Helper. But the grid just shows loading circle animation and does not get data.

@{
    ViewBag.Title = "UsersListing";
}

<h2>UsersListing</h2>
@using System.Data;
@model IQueryable<COMMON.Models.User>


@(Html.Infragistics().Grid<COMMON.Models.User>()
            .ID("MyGrid")
            .PrimaryKey("usr_Username")
            .AutoGenerateColumns(true)
            .AutoGenerateLayouts(true)
    .Features(features =>
    {
        
        features.Tooltips();
        features.Responsive().EnableVerticalRendering(false);
        features.Resizing();
        features.Sorting();
        features.Paging().PageSize(10).Type(OpType.Remote).RecordCountKey("ResponseCountKey");
        features.Filtering().FilterDialogContainment("window").Mode(FilterMode.Advanced).Type(OpType.Local);
        
    })
                .ResponseDataKey("Records")
                .DataSourceUrl(Url.Action("GetUsers","Users"))
                .Width("1000px")
                .Height("400px")
                .DefaultColumnWidth("90px")
                .DataBind()
                .AvgRowHeight("200px")
                .Render()                
    )

PS: I have read the replies in this thread http://es.infragistics.com/community/forums/p/79298/400741.aspx#400741

But i am unable to achieve what i wanted.  Please provide a short working sample if you can of autogeneratecolumns(true) using MVC Helper where all the settings are set in action method of controller rather than the ViewPages.

Hello led zeppelin,

After investigating this matter further and discussing it with our developers I believe the reason for this issue is that AutoGenerateColumns property is not recommended to be used  with dataSourceUrl  property.  AutoGenerateColumns(true) in MVC expects data source to be available in initialization time, because it implicitly generates columns definitions and sets AutoGenerateColumns(false). This is done on purpose in order to support other basic scenarios.  When DataSourceUrl is used and you didn't provide data source explicitly the data source is not available at initialization time, thus the grid generates a JavaScript error on the client side in browser error console (as you may notice with the sample project attached)

Additionally, in order to change your model dynamically you should initialize the grid using Java Script instead of using MVC chaining initialization.

Regarding your remote paging scenario what I can suggest is explicitly setting the pageIndexUrlKey and pageSizerUrlKey. By design, if they are not set the grid will make an oData query to retrieve values for them. The configuration of your grid should be similar to the following:

$('#grid1').igGrid({ 
         dataSource: "/Home/GetData",       // your data should be retrieved here
         autoGenerateColumns: true, 
         features: [ 
                 { 
                         recordCountKey: 'TotalRecordsCount', 
                         pageIndexUrlKey: 'page', 
                         pageSizeUrlKey: 'pageSize', 
                         name: 'Paging' 
                 } 
         ]
         

I am attaching a sample project for your reference. In this application there are two igGrids – one created using MVC Helper, which is not loading the data correctly and one created using Java Script, which is working as expected.

I hope you find this information helpful, please let me know if you need any additional information regarding this matter.

Thanks for the detailed response Vasya. Appreciate your help. Now I understand that this was a dataSource issue but I didnt know how to provide different dataSource at runtime as required.

I wanted to use MVC Helper because of some reasons and not Jquery.

So I tried this method and its working now.

VIEW:

@model Infragistics.Web.Mvc.GridModel

    @Html.Partial("_ListingCombo")

<br/>

@if(ViewBag.entityValue != null)
{
    @Html.Infragistics().Grid(Model)
}         

CONTROLLER:

 [HttpPost]
        public ActionResult Listing(string entityValue)
        {
           ViewBag.entityValue = entityValue;
           GridModel gridModel = GetGridModel();
           return View(gridModel);
        }

private GridModel GetGridModel()
        {
            GridModel gridModel = new GridModel();
            gridModel.ID = "MyGrid";
            gridModel.AutoGenerateColumns = true;
            gridModel.AutoGenerateLayouts = true;
            gridModel.PrimaryKey = "usr_Username";
            gridModel.Width = "100%";
       
            gridModel.DataSourceUrl = Url.Action("GetUsers","Users");    //I think this way I can provide these value at runtime to change datasource?
            gridModel.DataSource = GetUsrs().AsQueryable();// And also invoke another method inplace of GetUsrs at runtime to change datasource dynamically?
            gridModel.ResponseDataKey="Records";                        
            gridModel.Features.Add(new GridTooltips());
            gridModel.Features.Add(new GridFiltering() { Type = OpType.Remote, Inherit = true});
            gridModel.Features.Add(new GridSorting() { Type = OpType.Remote, Inherit = true });
            gridModel.Features.Add(new GridPaging() { Type = OpType.Remote, Inherit = true, PageSize = 5 ,CurrentPageIndex=0,TotalRecordsCount=20 });
            return gridModel;
        }

What do you suggest, Is this approach right ?

Hello zeppelin led,

Thank you for getting back to me.

When using this approach initially the data source for the igGrid will be loaded from the DataSource property. Afterwards, when requests are made, for example from the remote features being used(such as Filtering, Sorting, Paging) the data source will be loaded from the action set in the DataSourceUrl property.

I hope you find this information helpful.

Please let me know if you have any further questions regarding this matter.

Thanks for the information

I am facing another problem right now. When I first wrote code of the grid in my controller (posted above), there was a row on top of the grid for filtering data , which contained textboxes for searching the grid items, but now for some strange reason that row disappeared, I dont remember doing anything with the filtering feature, I just notcied it is not there anymore, I tried to change the filtering type from remote to local and then back to remote but that too dint help. Other features like pagination are working but the filtering feature mysteriously disappeared. Can you help me in this regard, what could have happened .. I only played around with gridDataSource & gridDataSourceUrl , but I didnt change any filtering property. please help me out here.

Also when I increase the grid page size, the grid container expands , I need a vertical scroller to appear and dont want the grid to expand itself.

Thanks. Please try to answer these questions here if you can because I think these are more or less similar issues regarding the grid features.

Hello zeppelin led,

Please feel free to contact me if oyu have any additional questions regarding this matter.

Hello zeppelin led,

I am glad that you consider my suggestions helpful.

Please feel free to contact me if you have any additional questions regarding this matter.

Thanks alot for your help & time, much appreciated.

Hello zeppelin led,

I am glad that you resolved the issue with filtering.

What I can suggest for achieving your second requirement is setting a fixed height to the igGrid using its height property. In this scenario if you change the page size of the Paging feature and the total sum of all the row heights exceeds the initially set height of the grid a scrollbar will appear for the grid.

I hope this will help you achieve the look and feel for igGrid that you are looking for.

Please let me know if you have any additional questions regarding this matter.

One last question:

When I increase the grid page size, the grid container expands but I need a vertical scrollbar to appear and dont want the grid to expand itself.

How would i do this, i am using mvc controller's action method to create my gridmodel. How do i add a feature to achieve this.