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
400
Change entire specific column's background color in igGrid
posted

I am trying to change the color of entire column of igGrid.

I wrote a JavaScript code in the Index.cshtml page for the same, which is as below:

---------------------------------------------------------------------

<div style="float: left;">
@Html.DropDownListFor(m => m.SelectedItmCategory, Model.lstItmCategory, htmlAttributes: new { @class = "form-control", @id = "cmbproj", style = "float:right;", @onChange = "fnAssignModuleName(this.id);" })
</div>


@Html.HiddenFor(m => m.SelectedItmCategory, new { @id = "hdnSelectedItmCategory" })


<script>
function fnAssignModuleName(id) {

debugger;
var gridId = "DevpProject_Index"; //getting gridId of current controller
var moduleName = $("#" + 'cmbproj' + " option:selected").val(); //getting the CategoryDescription='Others'
var columnIndex;
if (gridId == "DevpProject_Index" && moduleName == "Others")
{
for (i = 0; i < gridId.length; i++)
{
//columnIndex = $("#" + gridId + "_" + "DEVP_HDR_VARIANCE_REASONS").data("columnIndex");
//$(grid.igGrid("cellAt", columnIndex, i)).css('background-color', 'red');


$("#" + gridId + "_" + "DEVP_HDR_VARIANCE_REASONS").css('background-color', 'red');
}
}
else
{
$("#" + gridId + "_" + "DEVP_HDR_VARIANCE_REASONS").css('background-color', '#38B09D');
}
}
</script>

-------------------------------------------------------------------

using line: $("#" + gridId + "_" + "DEVP_HDR_VARIANCE_REASONS").css('background-color', 'red');
I am able to change the required column's header backgroud color in igGrid.

But I want to change the entire column backgroud color in igGrid. For this, I tried below lines of code but the 2nd line is not giving the desired output:

//columnIndex = $("#" + gridId + "_" + "DEVP_HDR_VARIANCE_REASONS").data("columnIndex");
//$(grid.igGrid("cellAt", columnIndex, i)).css('background-color', 'red');

Please let me know how to achieve it.

Thanks in advance

Parents Reply Children
No Data