What's New?

[CLOSED] GridPanel Row Background color dynamic set

  1. #1
    Sep 22, 2013, 7:33 AM

    [CLOSED] GridPanel Row Background color dynamic set

    Hi,

    I have seen following example to set row background color ,

    https://examples2.ext.net/#/GridPane...rking_Records/

    but my purpose is not solved. I want to set color from my database. I have this collor code in my store, but how to set this color code in style?
    for e.g

    <style>
        .dirty-row .x-grid-cell, .dirty-row .x-grid-rowwrap-div {
            background-color: #FFFDD8 !important;
        }
        
        .new-row .x-grid-cell, .new-row .x-grid-rowwrap-div {
            background: #c8ffc8 !important;
        } 
    </style>
    So in above example, bold highlighted is dynamic for me which will come from database, so how can I set?

    Thanks
    Last edited by Daniil; Sep 25, 2013 at 5:29 AM. Reason: Please use [CODE] tags, [CLOSED]
  2. #2
    Sep 23, 2013, 6:43 AM
    Hi @shaileshsakaria,

    You can register CSS classes on the fly using the Ext.net.ResourceMgr.registerCssClass method.

    Example
    <%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            Store store = this.GridPanel1.GetStore();
            store.DataSource = new object[] 
            { 
                new object[] { "test1", "red" },
                new object[] { "test2", "green" },
                new object[] { "test3", "yellow" }
            };
        }
    }
</script>

<!DOCTYPE html>
<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>

    <script>
        var getRowClass = function (record, rowIndex, rowParams, store) {
            var clsName = "row" + record.data.color,
                clsStyle = Ext.String.format(".{0} .x-grid-cell, .{0} .x-grid-rowwrap-div { background-color: {1} !important; })", clsName, record.data.color);

            Ext.net.ResourceMgr.registerCssClass(clsName, clsStyle);

            return clsName;
        };
    </script>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server">
            <Store>
                <ext:Store runat="server">
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="test" />
                                <ext:ModelField Name="color" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column runat="server" Text="Test" DataIndex="test" />
                    <ext:Column runat="server" Text="Color" DataIndex="color" />
                </Columns>
            </ColumnModel>
            <View>
                <ext:GridView runat="server">
                    <GetRowClass Fn="getRowClass" />
                </ext:GridView>
            </View>
        </ext:GridPanel>
    </form>
</body>
</html>
    Please note, to improve the performance it might be better to register all the required CSS classes before rendering of the GridPanel. The Ext.net.ResourceMgr.registerCssClass call in the getRowClass can slow down the rendering process.

Similar Threads

  1. Binding Dynamic Store to Dynamic ComboBox inside a GridPanel
    By rishu in forum 2.x Help
    Replies: 4
    Last Post: Sep 17, 2013, 11:12 AM
  2. Dynamic Gridpanel with Dynamic store is not working in combobox selection event
    By NishaLijo in forum 1.x Help
    Replies: 0
    Last Post: Jun 17, 2013, 11:05 AM
  3. How can i bind the dynamic gridpanel with the dynamic store. Please help me below is the code
    By krishna in forum 1.x Help
    Replies: 0
    Last Post: Mar 04, 2011, 12:05 PM
  4. Row Color on the GridPanel
    By flaviodamaia in forum 1.x Help
    Replies: 2
    Last Post: Sep 14, 2010, 1:26 PM
  5. how to set the color for particular row in gridpanel
    By Dinesh.T in forum 1.x Help
    Replies: 0
    Last Post: Jun 11, 2009, 3:45 AM

Tags for this Thread

Posting Permissions