Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to format the row based on condition in kendo ui mvc grid

I am working on asp.net mvc. I am trying to display list of messages in a Kendo mvc ui grid. I have written the code like,

Html.Kendo().Grid((List<messages>)ViewBag.Messages))
                .Name("grdIndox")
                .Sortable(m => m.Enabled(true).SortMode(GridSortMode.MultipleColumn))
                .HtmlAttributes(new { style = "" })
                .Columns(
                col =>
                {
                    col.Bound(o => o.RecNo).HtmlAttributes(new { style = "display:none" }).Title("").HeaderHtmlAttributes(new { style = "display:none" });
                    col.Bound(o => o.NoteDate).Title("Date").Format("{0:MMM d, yyyy}");
                    col.Bound(o => o.PatName).Title("Patient");
                    col.Bound(o => o.NoteType).Title("Type");
                    col.Bound(o => o.Subject);

                }

                )
                .Pageable()
                .Selectable(sel => sel.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
                .DataSource(

                           ds => ds.Ajax().ServerOperation(false).Model(m => m.Id(modelid => modelid.RecNo))
                         .PageSize(10)
                            //.Read(read => read.Action("Messages_Read", "Msg"))
                )

                .Events(ev => ev.Change("onSelectingGirdRow"))
                ) 

and i have the field in the table like IsRead-boolean type. so if the message is unread message then i need to format that record with bold font. I have used clientTemplates but with that i am able to format only particular cells i want format entire row. Please guide me.

like image 473
Karthik Bammidi Avatar asked Oct 11 '12 07:10

Karthik Bammidi


1 Answers

as Sanja suggested you can use the dataBound event but it will be better to cycle through the tr elements (the rows). Also I assume that you will need the related dataItem to check if the property that indicates if the message is read.

e.g.

dataBound: function ()
{
   var grid = this;
   grid.tbody.find('>tr').each(function(){
     var dataItem = grid.dataItem(this);
     if(!dataItem.IsMessageRead)
      {
         $(this).addClass('someBoldClass');
      }
   })
}
like image 179
Petur Subev Avatar answered Oct 14 '22 05:10

Petur Subev