Hi I am using trying to use the 12.2 igGrid with MVC 4. The grid binds with no problem however, when the page is rendered the grid is not visible. Controller code:
[GridDataSourceAction] public ActionResult Index() {
//Get complete list of Templates from DB var templates = from t in db.FolderTypes orderby t.TypeID select new Template { ID = t.TypeID, Desc = t.TypeDescription, Added = t.DateAdded, AddBy = t.AddedBy, Modified = t.DateModified, ModBy = t.ModifiedBy, Enabled = t.Enabled, DisplayOrder = t.DisplayOrder };
return View(templates.AsQueryable<Template>()); ; }
View code:
@( Html.Infragistics().Grid(Model).ID("grid1") .PrimaryKey("ID") .AutoGenerateColumns(true) .AutoGenerateLayouts(true) .Virtualization(false) .LocalSchemaTransform(true) .RenderCheckboxes(true) .Columns(column => {
column.For(x => x.ID).DataType("string").HeaderText("ID"); column.For(x => x.Desc).DataType("string").HeaderText("Description"); column.For(x => x.AddBy).DataType("string").HeaderText("Added By"); column.For(x => x.Added).DataType("date").HeaderText("Date Added"); column.For(x => x.ModBy).DataType("string").HeaderText("Modified By"); column.For(x => x.Modified).DataType("date").HeaderText("Date Modified"); column.For(x => x.Enabled).DataType("string").HeaderText("Enabled"); }) .Features(features => { features.Sorting().Type(OpType.Local); features.Paging().PageSize(30).Type(OpType.Local); features.Selection().Mode(SelectionMode.Row); features.Updating().EnableAddRow(false).EnableDeleteRow(true) .EditMode(GridEditMode.RowEditTemplate) .RowEditDialogContainment("owner") .RowEditDialogWidth("300px") .RowEditDialogHeight("200px") .RowEditDialogOkCancelButtonWidth("100px") .RowEditDialogFieldWidth("150px") .ShowReadonlyEditors(false) .RowEditDialogRowTemplateID("rowEditDialogRowTemplate1") .ColumnSettings(settings => { settings.ColumnSetting().ColumnKey("ID").ReadOnly(true); settings.ColumnSetting().ColumnKey("AddBy").ReadOnly(true); settings.ColumnSetting().ColumnKey("Added").ReadOnly(true); settings.ColumnSetting().ColumnKey("ModBy").ReadOnly(true); settings.ColumnSetting().ColumnKey("Modified").ReadOnly(true);
settings.ColumnSetting().ColumnKey("Desc").EditorType(ColumnEditorType.Text).TextEditorOptions(options => options.ValidatorOptions(option => { option.KeepFocus(ValidatorKeepFocus.Never); option.BodyAsParent(false); option.Required(true); })); settings.ColumnSetting().ColumnKey("Enabled").EditorType(ColumnEditorType.Text).TextEditorOptions(options => options.ValidatorOptions(option => { option.KeepFocus(ValidatorKeepFocus.Never); option.BodyAsParent(false); option.Required(true); })); }); }) .DataBind() .Height("500px") .Width("100%") .Render())
Hi,
First GridDataSouceAction attribute is not needed in your scenario. GridDataSourceAction is needed when you have configured DataSourceUrl.
Second, you should check your browser error console for a client side errors. I don't see igLoader in the code you provided. Are you using igLoader or not?
Third, make sure that you're using the Infragistics.Web.Mvc.dll compiled for MVC 4.
Best regards,
Martin Pavlov
Infragistics, Inc.
Yes, Im using the loader, this is the code that I'm using to call the loader. I am not getting any client side errors, The page renders but my grid isnt there.
@model IQueryable<Template>
@using Infragistics.Web.Mvc
@section HeadContent { <script src="@Url.Content("~/Scripts/Infragistics/js/infragistics.loader.js")"></script> @(Html.Infragistics().Loader() .ScriptPath(Url.Content("~/Scripts/Infragistics/js/")) .CssPath(Url.Content("~/Content/Infragistics/css/")) .Render() ) <style type="text/css"> .tableBackGround { background-color: #FF7283; } .labelBackGround { background-color: #FFE96D; } </style> <script id="rowEditDialogRowTemplate1" type="text/x-jquery-tmpl"> <tr class="tableBackGround"> <td class="labelBackGround"> ${headerText} </td> <td data-key='${dataKey}'> <input /> </td> </tr> </script> <script type="text/javascript"> $("#grid1").live("iggridupdatingdatadirty", function (event, ui) { $("#grid1").igGrid("saveChanges"); return false; }); </script>}