Get skin color name by item reference.

4 posts, 0 answers
  1. Paul
    Paul avatar
    2 posts
    Member since:
    Mar 2014

    Posted 27 Mar 2014 Link to this post

    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
                }
            }
        }
    }

  2. Eyup
    Admin
    Eyup avatar
    3051 posts

    Posted 02 Apr 2014 Link to this post

    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.

     
  3. Paul
    Paul avatar
    2 posts
    Member since:
    Mar 2014

    Posted 04 Apr 2014 in reply to Eyup Link to this post

    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 :)
     
  4. Eyup
    Admin
    Eyup avatar
    3051 posts

    Posted 09 Apr 2014 Link to this post

    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.

     
Back to Top