Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
2060
Multiple Layout Rows within Datarow format error
posted

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())

Parents
  • 17590
    Offline posted

    5076.igGridMRLEmptyRowHeight.zip

    Hello Nathan,

    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.

    Regards,
    Vasya Kacheshmarova
    Associate Software Developer
    Infragistics

Reply Children