Forums Ignite UI for jQuery
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
Close
Jagdip Singh
210
Set width of Column conditionally
posted

Hello there,

I'm trying to set the width of a column on a Grid conditionally but struggling with binding on the events to do so.

Context: Razor views/MVC 5

The condition is a property on the c# Model on the page. i.e. Model.ShowColumn.

This is the setup of the grid.

@(Html.Infragistics().Grid<AddressGridRowViewModel>()
    .ID(Model.GridId)
    .Defaults()
    .Render()
)

I've tried a few things to bind onto this and then set the width of the column to 0 (i.e. not show it) but with no luck.

Method 1

$('#@Model.GridId').on("iggridrendering", function (evt, ui) {
var message = "iggridrendering";
console.log(message);
debugger;
});

Method 2

$('#@Model.GridId').igGrid({
rendered: function (evt, ui) {
var isProductionSite = '@Model.IsProductionSite' == '@true';
if (isProductionSite) {
debugger;

var cols = $('#@Model.GridId').igGrid("option", "columns");

var addressTypeColumn = _.findWhere(cols, { key: "AddressType" });
addressTypeColumn.width = 0;
}
}
});

Please advise.

 

Parents
No Data
Reply
  • 1235
    posted

    Hello Jagdip,

    Setting a column in the igGrid to hidden should happen before the data is rendered. To do so, either set the column's "hidden" attribute to true on the column definition:


    $("#grid").igGrid({
        columns: [
            ... ,
            { key: "HiddenCol", dataType: "string", hidden: true },
            ...
        ]
    });

    Or change the hidden attribute of a certain column on dataRendering event. For example:


    $("#grid").igGrid({
        ...
        dataRendering: function (evt, ui) {
            var columns = $("#grid").igGrid("option", "columns");
            for (var i = 0 ; i < columns.length ; i++) {
                if(columns[i].key == "HiddenCol") {
                    columns[i].hidden = true;
                }
            }
        }
    });

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

    Regards,
    Ivaylo Hubenov
    Entry-level developer

Children