[Solved] Custom Formatting in the Grid

[Sasikanth KS]

Hi,

In the Gird a custom class is applied usingRowAction, for some of the rows the custom class is applied but for some of the rows custom class and t-alt is applied, below is the code.

.RowAction(row =>

{

 

    if (row.DataItem.InvestmentPerformance.IsComparativeIndex)

 

    {

        row.HtmlAttributes[

"class"] = "compartiveindex";

 

    }

    }

)
Example: For some of the rows class "Compartiveindex" and "t-alt" is applied for some of the rows only "Compartiveindex" is applied please check the attached screen shot. Let me know if I am missing any thing.

Thanks
--Sasi

[Atanas Korchev]

Hi Sasikanth KS,

By design the "t-alt" class is applied internally to all alternating rows. I guess the t-alt class is overriding the settings specified by your custom class. If yes please paste here the CSS. We will let you know how to make it override "t-alt".

Regards,
Atanas Korchev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Sasikanth KS]

Hi,

Below is the required, please check it.

.compartiveindex

{

 

background:#dff2fc;font-style:italic;

 

}

.compartiveindex

 

.t-alt

 

{

 

background:#dff2fc;font-style:italic;

 

}

Thanks,
--Sasi

[Atanas Korchev]

Hi Sasikanth KS,

You could fix the styling issue by increasing the CSS specificity Modify the CSS rule declaration like this:

.t-grid tr.compartiveindex
{
    background:#dff2fc;
    font-style:italic;
}

Regards,
Atanas Korchev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Sasikanth KS]

Hi,

Thanks for the help.

Thanks,
--Sasi

[Vincent Girard]

Does the RowAction works with Ajax call? When I try to add a class it's not working...

Here's my code : 

<%= Html.Telerik().Grid<Subscription>()
                    .Name("Grid")

                    .Columns(colums =>
                     {
                         colums.Bound(c => c.Verify).ClientTemplate("<span class=\"verify-<#=Verify#>\"><#=Verify#></span>");
                         colums.Bound(c => c.FormattedDate).Title("Date");//.ClientTemplate("<a href=\"" + Url.Action(MVC.Subscription.Modifier()) + "/<#=Id#>\" ><#=FirstName#></a>");
                         colums.Bound(c => c.PartName).Title("Nom").Format(Server.HtmlEncode("{0}"));
                         colums.Bound(c => c.PartEmail).Title("Courriel");
                         colums.Bound(c => c.PartPhone).Title("Téléphone");
                         //colums.Bound(c => c.Id).Title(" ").HeaderHtmlAttributes(new { @class = "center-text" }).HtmlAttributes(new { @class = "center-text" }).Format("<a id=\"deleteLink{0}\" href=\"#\" title=\"Supprimer\" onclick=\"if(confirm('Voulez-vous vraiment supprimer cet administrateur?')){ return deleteAdmin({0});} else { return false;};\"><img src=\"../Content/images/icons/cross.png\" alt=\"Supprimer\" /></a>");
                     })
                    .DataBinding(d => d.Ajax().Select("ListAjax", "Subscriptions", new {monthYear = Model.DefaultMonthYear}))
                    .RowAction(r =>
                       {
                           //if (!r.DataItem.Verify)
                           //{
                               r.HtmlAttributes["style"] = "background:red;";
                               r.HtmlAttributes["class"] += " verified";
                           //}
                       })
                    .Sortable()
            %>

Thanks!

[Vincent Girard]

Found my response in this post : http://www.telerik.com/community/forums/aspnet-mvc/grid/row-color-based-on-model.aspx

If it's in Ajax we have to do it this way : 

.ClientEvents(events => events.OnRowDataBound("onRowDataBound"))

function onRowDataBound(e) {
            if (e.dataItem.Verify) {
                e.row.className += " verified";
            }
        }