I've got a grid with multiple columns, laid out over three rows. The final row in this layout spans all the columns and is a text field. When this field has data in it, it displays find. When there's no data, the row loses it's height. I've attached images to highlight the issue.
Here's my grid layout.
@(Html.Infragistics() .Grid(Model) .ID("igGridSubCompartments") .Width("100%") .Height("100%") .AutoGenerateColumns(false) .AutoGenerateLayouts(false) .PrimaryKey("SubcompartmentId") .UpdateUrl(Url.Action("SubCompartmentSaveData")) .Columns(column => { column.For(x => x.CompartmentRef).HeaderText("C/Ref").ColumnIndex(0).RowIndex(0).Width("90px"); column.For(x => x.SubCompartmentRef).HeaderText("SC/Ref").ColumnIndex(1).RowIndex(0).Width("90px"); column.For(x => x.SubSubRef).HeaderText("SS/Ref").ColumnIndex(2).RowIndex(0).Width("90px"); column.For(x => x.OverallArea).HeaderText("Area").ColumnIndex(3).RowIndex(0).Width("80px"); column.For(x => x.MainPlantYear).HeaderText("MP Yr").ColumnIndex(4).RowIndex(0).Width("90px"); column.For(x => x.MainSpecies).HeaderText("MS").ColumnIndex(5).RowIndex(0).Width("80px"); ; column.For(x => x.PercStocking).HeaderText("% Stg.").ColumnIndex(6).RowIndex(0).Width("90px"); column.For(x => x.YieldModel).HeaderText("YM").ColumnIndex(7).RowIndex(0).Width("70px").FormatterFunction("lookupYieldModel"); column.For(x => x.YieldClass).HeaderText("YC").ColumnIndex(8).RowIndex(0).Width("70px").FormatterFunction("lookupYieldClass"); column.For(x => x.PriceSize).HeaderText("PS").ColumnIndex(9).RowIndex(0).Width("70px").FormatterFunction("lookupPriceSize"); column.For(x => x.Rotation).HeaderText("Rot.").ColumnIndex(10).RowIndex(0).Width("70px"); column.For(x => x.WindHazard).HeaderText("WH").ColumnIndex(11).RowIndex(0).Width("70px"); column.For(x => x.UkwasClass).HeaderText("UKWAS").ColumnIndex(12).RowIndex(0); column.For(x => x.DigiArea).HeaderText("D.Area").ColumnIndex(0).RowIndex(1).Width("90px"); column.For(x => x.Provenance) .HeaderText("<span class='pull-left'>Provenance</span> <span class='pull-right'><em>Next Crop:</em></span>") .ColumnIndex(1).RowIndex(1).ColSpan(4); column.For(x => x.MainSpeciesNc).HeaderText("<em>MS</em>").ColumnIndex(5).RowIndex(1).Width("80px"); column.For(x => x.PercStockingNc).HeaderText("<em>% Stg.</em>").ColumnIndex(6).RowIndex(1).Width("90px"); column.For(x => x.YieldModelNc).HeaderText("<em>YM</em>").ColumnIndex(7).RowIndex(1).Width("70px").FormatterFunction("lookupYieldModel"); ; column.For(x => x.YieldClassNc).HeaderText("<em>YC</em>").ColumnIndex(8).RowIndex(1).Width("70px").FormatterFunction("lookupYieldClass"); column.For(x => x.PriceSizeNc).HeaderText("<em>PS</em>").ColumnIndex(9).RowIndex(1).Width("70px").FormatterFunction("lookupPriceSize"); column.For(x => x.RotationNc).HeaderText("<em><em>Rot.</em>").ColumnIndex(10).RowIndex(1).Width("70px"); column.For(x => x.WindHazardNc).HeaderText("<em>WH</em>").ColumnIndex(11).RowIndex(1).Width("70px"); column.For(x => x.UkwasClassNc).HeaderText("<em>UKWAS</em>").ColumnIndex(12).RowIndex(1); column.For(x => x.Comments).HeaderText("Comments").ColumnIndex(0).RowIndex(2).ColSpan(13);
}) .Features(f => { f.AppendRowsOnDemand() .ChunkSize(25) .LoadTrigger(LoadTrigger.Auto); f.Filtering() .Mode(FilterMode.Advanced); f.Sorting() .Mode(SortingMode.Single) .ColumnSettings(cs => cs.ColumnSetting().ColumnKey("CompartmentRef").AllowSorting(true).CurrentSortDirection("ascending"));
f.Updating() .AddClientEvent("editCellStarting", "ondropDown") .AddClientEvent("editCellEnded", "onCellEndEdit") .EnableAddRow(true) .EnableDeleteRow(true) .EditMode(GridEditMode.Cell) .ColumnSettings(cs => { cs.ColumnSetting().ColumnKey("MainSpecies").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(300).ItemTemplate("<div><div class='speciesCode'>${Species}</div><div class='speciesDescription'>${Description}</div></div>")); cs.ColumnSetting().ColumnKey("MainSpeciesNc").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(300).ItemTemplate("<div><div class='speciesCode'>${Species}</div><div class='speciesDescription'>${Description}</div></div>")); cs.ColumnSetting().ColumnKey("YieldModel").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(350).ItemTemplate("<div><div class='yieldModelNo'>${YmNo}</div><div class='yieldModelDesc'>${YmDescription}</div><div class='yieldModelSpacing'>${Spacing}</div></div>")); cs.ColumnSetting().ColumnKey("YieldModelNc").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(350).ItemTemplate("<div><div class='yieldModelNo'>${YmNo}</div><div class='yieldModelDesc'>${YmDescription}</div><div class='yieldModelSpacing'>${Spacing}</div></div>")); cs.ColumnSetting().ColumnKey("YieldClass").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(60)); cs.ColumnSetting().ColumnKey("YieldClassNc").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(60)); cs.ColumnSetting().ColumnKey("PriceSize").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(100)); cs.ColumnSetting().ColumnKey("PriceSizeNc").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(100)); cs.ColumnSetting().ColumnKey("UkwasClass").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(250)); cs.ColumnSetting().ColumnKey("UkwasClassNc").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(250)); cs.ColumnSetting().ColumnKey("WindHazard").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(40)); cs.ColumnSetting().ColumnKey("WindHazardNc").EditorType(ColumnEditorType.Combo).ComboEditorOptions( co => co.Mode(ComboMode.Editable).EnableClearButton(false).DropDownWidth(40));
}); }) .DataSource(Model) .DataBind() .Render())
Hello Nathan,
Thank you for your feedback. In Infragistics we are constantly trying to improve our products, samples and documentation based on both positive and negative feedback so I will forward your comments to the appropriate management team for review and consideration.
Good luck with your project!
Regards,Vasya KacheshmarovaAssociate Software DeveloperInfragistics
Hi Vasya,
Thanks for coming back to me.
I've been having too much trouble with the Infragistics web controls and the support I have had with answering the other questions on these controls has been a waste of my time.I decided to buy a Telerik licence instead. Although it may be a little more expensive the documentation and examples were far superior than Infragistics offering and I managed to achieve everything I wanted without having to use their support.
Thank you for your help but I won't need any further help on the web side of things.
Kind regards,
Nathan
5076.igGridMRLEmptyRowHeight.zip
Thank you for posting in our community.
I tried to reproduce the behavior that you are describing. I created a small sample using a columns collection similar to the one from your post. However, I was not able to replicate the issue on my side. Attached you will find the small app that I used. Please test it on your side and let me know what is the result. If this is not an accurate demonstration of what you are trying to achieve please feel free to modify it and send it back to me along with steps to reproduce. This is going to be highly appreciated and will help me in my further investigation.