'No Records To ..' change the background color.

2 posts, 0 answers
  1. Asif
    Asif avatar
    49 posts
    Member since:
    Jul 2010

    Posted 18 Oct 2011 Link to this post

    Dear Support

    I have an radgrid in I have used Filter. When the user type some valid or invalid text in filter then the area in which record is displayed I want to change the background color of that area as well as text color of 'No records to display'.

    Please find the attachment for more clear vision on this issue.
  2. Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 20 Oct 2011 Link to this post

    Hello Asif,

    Thank you for contacting us and for your questions.

    In order to have red background, when there are no results left in RadGrid, you could set the NoRecordsTemplate as following:
    <NoRecordsTemplate>
    <div class="BackGroundClass">
     There are no records to display!
    </div>
    </NoRecordsTemplate>

    and the corresponding CSS class for the div element:
    .BackGroundClass
    {
        background-color:Red;
    }

    However, the other part where you want to change the background color of the filtered items is tricky. In order to change the color of filtered items, you should hook the ItemCommand event of RadGrid. In its body you should check if the command name is grid FilterCommandName. And if the value is true to find the filtered column and to set its ItemStyle's CssClass property to the name of the CSS class that will be applied.

    Namely:
    protected void radgridRedeemSummary_ItemCommand(object sender, GridCommandEventArgs e)
    {
        if (e.CommandName == RadGrid.FilterCommandName)
        {
            Pair filterPair = (Pair)e.CommandArgument;
     
            string colName = filterPair.Second.ToString();
            GridColumn column = radgridRedeemSummary.MasterTableView.GetColumnSafe(colName) as GridColumn;
            column.ItemStyle.CssClass = "filtered";
        }
    }

    And the CSS class:
    .filtered
    {
        background-color: Red;
        border-color: Red;
    }

    Give this code a try and let me know if it is working for you.

    Best wishes,
    Andrey
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top