I would like to hide an iggrid column on dropdownlist selection using Jquery. I tried the following but didn't work.
var hideTheColumn = $("#cntStatusID").val(); $("#lifeInsuranceGrid").delegate("iggridhidingcolumnhiding", function (evt, ui) { if (hideTheColumn == 3) { $("#lifeInsuranceGrid").igGridHiding("showColumn", columnsGrid); } else { $("#lifeInsuranceGrid").igGridHiding("hideColumn", columnsGrid); } });
and the definition of my grid is :
... columns: [{ headerText: headerTextValues[0], key: "insuranceID", hidden: true }, { headerText: headerTextValues[1], key: "amount", width: 175, template: "<a href='Home/ManageLifeInsuranceEditor?liId=${insuranceID}&command=edit' class='editLifeDialog'>${amount}</a>" }, { headerText: headerTextValues[2], key: "Benefname", width: 200, template: "<a href='Home/ManageLifeInsuranceEditor?liId=${insuranceID}&command=edit' class='editLifeDialog'>${Benefname}</a>" }, { headerText: headerTextValues[3], key: "Altername", width: 150, template: "<a href='Home/ManageLifeInsuranceEditor?liId=${insuranceID}&command=edit' class='editLifeDialog'>${Altername}</a>" }, { headerText: headerTextValues[4], key: "willMakerTypeDesc", hidden: true, width: 150, template: "<a href='Home/ManageLifeInsuranceEditor?liId=${insuranceID}&command=edit' class='editLifeDialog'>${willMakerTypeDesc}</a>" }, ],
Hi Maya,
I solved the problem.
I used
$(
".selector"
).igGrid(
"hideColumn"
, 1);
instead of $(".selector").igGridHiding("hideColumn", 1);
Thank you for your help and assistance anyway
Regards
Sonia
Thank you for your answer.
Yes I checked and I have the required JS files loaded. I wanted to try another example and now I got the error of unable to use hideColumn prior initialization, so I changed the code and put it inside an iggriddatabound but nothing happen. The alert message that I created is giving me the right output but the igGridHiding is not doing anything.
Please find below the example :
$("#poaraGrid").on("iggriddatabound", function (event, ui) {
var i, grid = ui.owner, ds = grid.dataSource, data = ds.data(), dataLengthPORA = data.length;
var columnPOA = $("#poaraGrid").igGrid("option", "columns"); var columnPOAKey = columnPOA[1].key;
alert(columnPOAKey );
if (columnPOAKey === "lkpoaratype") {
$("#poaraGrid").igGridHiding("hideColumn", "lkPOARAName"); }
});
Hello Sonia ,
The error could be raised if the igGridHiding scripts are not loaded on the page.
Could you check in the browser’s network whether the all scripts loaded via the igLoader are loaded without any errors on your page?
Specifically check for the : infragistics.ui.grid.hiding.js file.
Also check if the jQuery selector: $("#poaraGrid") is properly returning the correct Dom element.
I’m looking forward to your reply.
Best Regards,
Maya Kirova
Developer Support Engineer II
Infragistics, Inc.
http://ko.infragistics.com/support
Thank you for this update. I will run it and let you know
Regarding the error in my previous post. I got that in my main project when I wanted to use the igGridHiding "word". Even with no dropdownlist change event. I just wanted to hide and show the column without using a dropdownlist change event to check if the problem is with my dropdowlist declaration or iggrid and I found that when using this igGridHiding I have that Jquery error.
Thank you
Are you getting this error with the attached sample?
Note in the previous attachement I’ve removed the dlls due to their size.
I’ve attached the sample again with all dlls except the Infragistics.Web.Mvc.
In order to run the sample copy the Infragistics.Web.Mvc assembly to the Bin folder of the project and add a reference to it.
Let me know if you’re able to run it after adding the assembly.