CellMerging apply on certain columns only

415

sarojanand posted over 7 years ago

I have a grid (attached screenshot) where I am using

{
name: "CellMerging",
initialState: "merged"
}

I want this feature to apply on certain columns only, not entire grid. How do I achieve this? I am using 2015.1 version. Also I am not able to get event "cellsMerged" as mentioned at "http://ko.infragistics.com/community/forums/p/96161/474977.aspx#474977". When I put a debugger, it never hits that. Is it the version I am using is wrong?

Please suggest.

535

Offline Michel Lemire posted over 7 years ago in reply to Ivaylo Hubenov

Is it possible to provide us the code for Razor MVC

I want just to merge the 1st column .

THX

@(Html.Infragistics()
.Grid(Model.CleaningTasks)
.ID("grid4")
.Width("100%")
.Height("500px")
.AutoGenerateColumns(false)
.AutoGenerateLayouts(false)
.Columns(column =>
{

column.For(x => x.EventDate).HeaderText("Placed Date").Format("ddd, dd MMM yy");
column.For(x => x.HouseNo).HeaderText("HOuse");
column.For(x => x.LastModificationDate).HeaderText("Last modif.");
})
.Features(features =>
{
features.Sorting().Type(OpType.Local);
features.CellMerging().InitialState(CellMergingInitialState.Merged);
//features.Paging().Type(OpType.Local);
//features.Filtering().Type(OpType.Local);
})

.DataSource(Model.CleaningTasks.Where(o => o.DetailsType == DetailsTypeEnum.Solded).AsQueryable())
.DataBind()
.Render()
)

thx
Cancel
Reply

Cancel
1235

Ivaylo Hubenov posted over 7 years ago
Hello Sarojanand,

This functionality can be achieved by removing the class, applying the style to a merged cell from every column, that should not have its cells merged. This class is called "ui-iggrid-mergedcell". You can access every cell of a column with the following query:

$("td[aria-describedby='<gridID>_<columnKey>']");

For example:

{
    name: "CellMerging",
    initialState: "merged",
    cellsMerged: function(evt, ui) {
        $("td[aria-describedby='grid1_ProductDescription']").removeClass("ui-iggrid-mergedcell");
        $("td[aria-describedby='grid1_UnitsInStock']").removeClass("ui-iggrid-mergedcell");
    }
    //where grid1 is the grid's ID and ProductDescription and UnitsInStock are columnkeys.
}

I have attached a sample, demonstrating how this is done.

Please feel free to contact me if you have further questions.

Regards,
Ivaylo Hubenov
Entry-level developer
cellMerging.zip
Cancel
Reply

Cancel