This is a migrated thread and some comments may be shown as answers.

Get skin color name by item reference.

3 Answers 130 Views
SkinManager
This is a migrated thread and some comments may be shown as answers.
Paul
Top achievements
Rank 1
Paul asked on 27 Mar 2014, 08:15 PM
Hello,

I am using the "Teleric C# Web Application" template for my project, and I am defining the skin in the web.config.

For 98% of my application, the theme arrangements of the skin are suitable.  I need to display a grid of normalized data of two related entities and the requirement is that the columns that represent the respective entities are different colors.  I need to set these values in two places ... on the web page and in the excel export.  I have some code samples below.

What I need is to be able to find some reference to a skin element (like the row color/alternate row color) and set these properties to the respective html color of that element to avoid the hard-coded values and not disconnect visual elements from the theme.

Thanks.

The grid cell background:

BasicGrid.Columns[0].ItemStyle.BackColor = System.Drawing.ColorTranslator.FromHtml("#ffffcc");


The excel table cells were more difficult to get to, but I this works for me:

protected void BasicGrid_ExcelExportCellFormatting(object sender, ExcelExportCellFormattingEventArgs e)
{
    if (e.Cell.UniqueID.Contains("ctl"))
    {
        TableCell cell = e.Cell as TableCell;
        int columnId = -1;
        String uniqueid = e.Cell.UniqueID.Split('$').Last();
        if (Int32.TryParse(uniqueid.Replace("ctl", ""), out columnId))
        {
            if (columnId <= this._midPoint + 1)
            {
                cell.Style["text-align"] = "left";
                cell.Style["background-color"] =  "#ffffcc";
                     //Needs to be the row color of the applied theme
            }
            else
            {
                cell.Style["text-align"] = "right";
                cell.Style["background-color"] = "#ccffcc";
                    //Needs to be the row alternate color of the applied theme
            }
        }
    }
}

3 Answers, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 02 Apr 2014, 06:44 AM
Hello Paul,

You can get the background colors on the client using the following approach:
<ClientSettings>
    <ClientEvents OnCommand="gridCommand" />
</ClientSettings>
JavaScript:
function gridCommand(sender, args) {
    if (args.get_commandName() == "ExportToExcel") {
        var firstRow = args.get_tableView().get_dataItems()[0].get_element();
        var secondRow = args.get_tableView().get_dataItems()[1].get_element();
 
        var rowBackColor = $telerik.$(firstRow).css("background-color");
        var altRowBackColor = $telerik.$(secondRow).css("background-color");
 
        if (rowBackColor == "transparent") {
            rowBackColor = "rgb(255, 255, 255)";
        }
 
        // pass these values to the server
    }
}

Then, pass them to the server using HiddenFields:
http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.hiddenfield%28v=vs.90%29.aspx

Hope this helps.

Regards,
Eyup
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Paul
Top achievements
Rank 1
answered on 04 Apr 2014, 08:56 PM
Hi,

Thanks for the reply.

This is pretty close to what I need ... but in my particular case the grid doesn't arrive on the page when it is first loaded.

It is displayed after the user interacts with some form values.

I was hoping that there was some sort of enum/struct (for the different styles) in the Telerik name space that I could use to get the color values and set them that way.

But your technique will at least help me find the values I need to use more quickly :)
 
0
Eyup
Telerik team
answered on 09 Apr 2014, 08:28 AM
Hi Paul,

I'm afraid it is not possible to get these values directly on the server-side. Please try to implement the suggested approach in your specific scenario and let us know if you need further assistance.

Regards,
Eyup
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
SkinManager
Asked by
Paul
Top achievements
Rank 1
Answers by
Eyup
Telerik team
Paul
Top achievements
Rank 1
Share this question
or