开发者

Telerik grid custom formatting changing displayed text colour If "Yes" green If "No" Red

开发者 https://www.devze.com 2023-01-30 22:39 出处:网络
I have a simple grid which I want 4 columns to have set that if \"Yes\" is displayed then it\'s in green and if \"No\" is displayed then it\'s in red, these are the only 2 values which those columns c

I have a simple grid which I want 4 columns to have set that if "Yes" is displayed then it's in green and if "No" is displayed then it's in red, these are the only 2 values which those columns can display

c.Bound(x => x.col1);
                    c.Bound(x => x.col2)
                        .Title("col2 example");
                    c.Bound(x => x.col3)
                        .Title("col3 example");
                    c.Bound(x => x.col4)
                        .Title("col4 example");
                    c.Bound(x => x.col5)
                        .Title("col5 example");

col2-5 are the ones in question

                col1 = x.col1,
                col2 = (x.col2Id.HasValue)  ? "Yes" : "No",
                col3 = (x.col3Id.HasValue) ? "Yes" : "No",
                col4 = (x.col4Id.HasValue) ? "Yes" : "No",
                col5 = (x.col5) ? "Yes" : "No"

ofc all the col... have different names but this way it's anon.

Edit - Tried the code in my latest project to find, client template = would always only display in those fields "Yes" in green, server template = would now display in the fields <span style='color:green'>Yes</span> if the field was meant to display yes and <span style='color:red'>No</span> if the field was meant to display no. so both bits of codes half work and the only difference between me using them then and now is that I'm now using mvc3.

Edit 2 - In whether it's a change with the latest version of telerik or something else I don't kn开发者_StackOverflow中文版ow but the issue was resolved if I changed the client template code to be like below.

.ClientTemplate("<# if(Col2 == 'Yes') { #><span style='color:green'>Yes</span><# } else { #><span style='color:red'>No</span><# } #>")


You should use either server or client templates to achieve the same (depending on the binding of your grid). Here is the server template:

c.Bound( x => x.col4).Template( x => 
{
%>
   <%= (x.col4.HasValue ? "<span style='color:green'>Yes</span>" : "<span style='color:red'>No</span>") %>
<%
});

And here is a client-side template:

c.Bound( x => x.col4).ClientTemplate("<# if(col4) { #><span style='color:green'>Yes</span><# } else { #><span style='color:red'>No</span><# } #>");


I just discovered there's a client side row bound event which can be used to modify the style of a row based on it's content. e.g.

    function onGridRowDataBound(e) {
        var row = e.row;
        var dataItem = e.dataItem;

        var eligible = e.row.cells[0].innerHTML.indexOf('Not') >= 0;
        if (eligible) {
            //Set the background of the entire row
            row.style.backgroundColor = "green";
        }
    }
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号