What's New?

[CLOSED] Manually setting grid cell to dirty - red triangle in corner

  1. #1
    Jun 20, 2012, 11:04 AM

    [CLOSED] Manually setting grid cell to dirty - red triangle in corner

    Hi
    I have a grid where I don't have a column for every record in a form. When I update one of these unrepresented fields I want to set the first cell in that grid for that record with the red triange to show this record is dirty.

    I plan to set the Grid cls="without-dirty". However, is it possible to set an individual cell to display the red triangle?

    thank you
    Last edited by Daniil; Jun 20, 2012 at 7:42 PM. Reason: [CLOSED]
  2. #2
    Jun 20, 2012, 1:52 PM
    Hi,

    Quote Originally Posted by GLD View Post
    I plan to set the Grid cls="without-dirty". However, is it possible to set an individual cell to display the red triangle?
    How does this CSS class look?
  3. #3
    Jun 20, 2012, 4:12 PM
    Quote Originally Posted by Daniil View Post
    Hi,



    How does this CSS class look?
    the one mentioned here http://forums.ext.net/showthread.php...Cell-Indicator
    for turning it off, then I would like to set specific cells manually to show it when a record is edited.
  4. #4
    Jun 20, 2012, 4:48 PM
    In Ext.NET v1 you can just set up 
    MarkDirty="false"
    for the GridView.

    To mark a cell as dirty, please use Column Renderer adding the "x-grid3-dirty-cell" CSS class for the respective cell.

    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", "test2", "test3" },
                new object[] { "test4", "test5", "test6" },
                new object[] { "test7", "test8", "test9" },
            };
            store.DataBind();
        }
    }
</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.NET Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
            <Store>
                <ext:Store runat="server">
                    <Reader>
                        <ext:ArrayReader>
                            <Fields>
                                <ext:RecordField Name="test1" />
                                <ext:RecordField Name="test2" />
                                <ext:RecordField Name="test3" />
                            </Fields>
                        </ext:ArrayReader>
                    </Reader>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column Header="Test1" DataIndex="test1">
                        <Editor>
                            <ext:TextField runat="server" />
                        </Editor>
                    </ext:Column>
                    <ext:Column Header="Test2" DataIndex="test2">
                        <Renderer Handler="if (record.data.dirtyTest2) {
                                               metadata.css += ' x-grid3-dirty-cell';
                                           }
                                           return value;" />
                        <Editor>
                            <ext:TextField runat="server" />
                        </Editor>
                    </ext:Column>
                    <ext:Column Header="Test3" DataIndex="test3">
                        <Editor>
                            <ext:TextField runat="server" />
                        </Editor>
                    </ext:Column>
                </Columns>
            </ColumnModel>
            <View>
                <ext:GridView runat="server" MarkDirty="false" />
            </View>
        </ext:GridPanel>

        <ext:Button runat="server" Text="Mark the Test2 column of the second row as dirty">
            <Listeners>
                <Click Handler="GridPanel1.getStore().getAt(1).set('dirtyTest2', true);" />
            </Listeners>
        </ext:Button>

        <ext:Button runat="server" Text="Clear dirty">
            <Listeners>
                <Click Handler="GridPanel1.getStore().getAt(1).set('dirtyTest2', false);" />
            </Listeners>
        </ext:Button>
    </form>
</body>
</html>
  5. #5
    Jun 20, 2012, 7:36 PM
    Many thanks, that worked a treat.

    Quote Originally Posted by Daniil View Post
    In Ext.NET v1 you can just set up 
    MarkDirty="false"
    for the GridView.

    To mark a cell as dirty, please use Column Renderer adding the "x-grid3-dirty-cell" CSS class for the respective cell.

    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", "test2", "test3" },
                new object[] { "test4", "test5", "test6" },
                new object[] { "test7", "test8", "test9" },
            };
            store.DataBind();
        }
    }
</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.NET Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
            <Store>
                <ext:Store runat="server">
                    <Reader>
                        <ext:ArrayReader>
                            <Fields>
                                <ext:RecordField Name="test1" />
                                <ext:RecordField Name="test2" />
                                <ext:RecordField Name="test3" />
                            </Fields>
                        </ext:ArrayReader>
                    </Reader>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column Header="Test1" DataIndex="test1">
                        <Editor>
                            <ext:TextField runat="server" />
                        </Editor>
                    </ext:Column>
                    <ext:Column Header="Test2" DataIndex="test2">
                        <Renderer Handler="if (record.data.dirtyTest2) {
                                               metadata.css += ' x-grid3-dirty-cell';
                                           }
                                           return value;" />
                        <Editor>
                            <ext:TextField runat="server" />
                        </Editor>
                    </ext:Column>
                    <ext:Column Header="Test3" DataIndex="test3">
                        <Editor>
                            <ext:TextField runat="server" />
                        </Editor>
                    </ext:Column>
                </Columns>
            </ColumnModel>
            <View>
                <ext:GridView runat="server" MarkDirty="false" />
            </View>
        </ext:GridPanel>

        <ext:Button runat="server" Text="Mark the Test2 column of the second row as dirty">
            <Listeners>
                <Click Handler="GridPanel1.getStore().getAt(1).set('dirtyTest2', true);" />
            </Listeners>
        </ext:Button>

        <ext:Button runat="server" Text="Clear dirty">
            <Listeners>
                <Click Handler="GridPanel1.getStore().getAt(1).set('dirtyTest2', false);" />
            </Listeners>
        </ext:Button>
    </form>
</body>
</html>

Similar Threads

  1. [CLOSED] Manually adding a new row to a grid - date issue
    By mattwoberts in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Oct 26, 2011, 7:01 PM
  2. [CLOSED] Update only dirty cell in the row of gridpanel
    By Shanth in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Aug 17, 2011, 12:46 PM
  3. Remove red dirty flags from grid.
    By AaronB3 in forum 1.x Help
    Replies: 2
    Last Post: Jun 27, 2011, 9:47 PM
  4. How to set Grid record dirty?
    By speddi in forum 1.x Help
    Replies: 0
    Last Post: Jul 16, 2010, 8:47 PM
  5. [CLOSED] Manually Set Grid Header Sort Icon
    By randy85253 in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Mar 09, 2009, 12:22 PM

Posting Permissions