[CLOSED] Need RowNumbererColumn to update store when a row is added or deleted.

[Shanth]

Hi

I am using RowNumbererColumn this Value should also update the store when a row is added or deleted.

or is there any way to update or modifiy the store using the valu from RowNumbererColumn

<ext:GridPanel 
                            ID="gpDimension" 
                            runat="server" 
                            Height="400" 
                            AnchorHorizontal="" 
                            FieldLabel=""
                            StoreID="CLCDimensionStore" 
                            StripeRows="true" 
                            AutoDataBind="true">
                            <View>
                                <ext:GridView ID="DimensionView" runat="server" MarkDirty="true" ForceFit="true" />
                            </View>
                            <SelectionModel>
                                <ext:RowSelectionModel ID="DimensionRowSelection" runat="server" />
                            </SelectionModel>
                            <ColumnModel ID="DimensionColumnModel" runat ="server">
                                <Columns>
                                    <ext:RowNumbererColumn Header="Level" Width="40" DataIndex="Level">
                                        <%--<Renderer Fn="customiseRowHeaderTitle" />--%>
                                    </ext:RowNumbererColumn>
                                    <%--<ext:Column ColumnID="DimensionLevel" Header="Level" DataIndex="Level" Sortable="true">
                                        
                                    </ext:Column>--%>
                                    <ext:Column ColumnID="DimensionName" Header="Name" DataIndex="Name">
                                        <Editor>
                                            <ext:TextField ID="txtDimensionName" runat="server" AllowBlank="false"/>
                                        </Editor>
                                    </ext:Column>
                                    <ext:CommandColumn Width="40" Hideable="false"  Header ="Delete">
                                        <Commands>
                                            <ext:GridCommand CommandName="delete" Icon="Cross">
                                                <ToolTip Text="Delete" />
                                            </ext:GridCommand>
                                        </Commands>
                                    </ext:CommandColumn>
                                </Columns>
                            </ColumnModel>
                            <Listeners>
                                <Command Fn="DimensionDeleteHandler" />
                            </Listeners>
                            <BottomBar>
                                <ext:Toolbar ID="tbAddDimension" runat="server" StyleSpec="background:transparent;border:0px;align:center;">
                                    <Items>
                                        <ext:ToolbarFill />
                                        <ext:Button runat="server" Text="Add" ID="btnAddDimension" Icon="Add">
                                            <%--<Listeners>
                                                <Click Handler="AddNewCompanyCodes({ Code: '', Description: '' });" />
                                            </Listeners>--%>
                                            <Listeners>
                                                <Click Handler="addGroup(#{gpDimension});" />
                                            </Listeners>
                                        </ext:Button>
                                    </Items>
                                </ext:Toolbar>
                            </BottomBar>
                        </ext:GridPanel>

Thank You

[Daniil]

Hi,

Please call:

GridPanel1.getView().refresh();

[Shanth]

Hi Daniil

My Delete and Add functions are

function addGroup(grid) {
            debugger;
            var rowCount = grid.store.getCount();
            var o = grid.store.addRecord({ Level: rowCount + 1 });
            grid.startEditing(o.index, 0);
        };

        var DimensionDeleteHandler = function (cmd, record) {
            debugger;
            switch (cmd) {
                case "delete":
                    Ext.Msg.confirm('Alert', 'Delete Record?', function (btn) {
                        if (btn == "yes") {
                            CLCDimensionStore.remove(record);
                            gpDimension.view.refresh();
                        }
                    });
                    break;
            }
        };

Where do i need to call this

GridPanel1.getView().refresh();

[Daniil]

Just after the .addRecord() and .remove() methods.

[Shanth]

Hi,

This updates the grid not the Store

I want to update the store, which has a field Level

which is also added to the DataIndex of RowNumbererColumn.
<ext:RowNumbererColumn Header="Level" Width="40" DataIndex="Level">                                        
</ext:RowNumbererColumn>

i can update the store atleast when i add the row to the grid.

function addGroup(grid) {             debugger;             var rowCount = grid.store.getCount();             var o = grid.store.addRecord({ Level: rowCount + 1 });             grid.startEditing(o.index, 0);         };

But can u suggest how to update the store when the i delete the row in the grid.

Thank you

[Daniil]

Not sure what you mean by "update a store".

After this code the record is deleted from the store.

CLCDimensionStore.remove(record);

Do you need to save it on server side?

[Shanth]

Hi

Do you need to save it on server side?

Yes, i need to save it on server side.

if, there is 3 rows and delete the 2nd row, in the UI it RowNumbererColumn will show me No. 1 and 2
But the field Level in the store will show me 1 and 3.

Thank You

[Daniil]

RowNumbererColumn doesn't use any DataIndex, even if you set up it.

If you need a row index as a record's field, I can suggest the following solution.

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();
        }
    }

    protected void OnSubmit(object sender, DirectEventArgs e)
    {
        X.Msg.Alert("Values", e.ExtraParams["values"]).Show();
    }
</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>
    <script type="text/javascript">
        var onDataChanged = function (store, grid) {
            store.each(function (r, index) {
                r.data.index = index;    
            });

            grid.getView().refresh();
        };
    </script>
</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" />
                                <ext:RecordField Name="index" />
                            </Fields>
                        </ext:ArrayReader>
                    </Reader>
                    <Listeners>
                        <DataChanged Handler="onDataChanged(this, GridPanel1)" Delay="10" />
                    </Listeners>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column 
                        ColumnID="numberer" 
                        DataIndex="index" 
                        Width="23"
                        Hideable="false"
                        MenuDisabled="true" />
                    <ext:Column Header="Test1" DataIndex="test1" />
                    <ext:Column Header="Test2" DataIndex="test2" />
                    <ext:Column Header="Test3" DataIndex="test3" />
                </Columns>
            </ColumnModel>
        </ext:GridPanel>
        <ext:Button runat="server" Text="Submit values">
            <DirectEvents>
                <Click OnEvent="OnSubmit">
                    <ExtraParams>
                        <ext:Parameter 
                            Name="values" 
                            Value="GridPanel1.getRowsValues()" 
                            Mode="Raw" 
                            Encode="true" />
                    </ExtraParams>
                </Click>
            </DirectEvents>
        </ext:Button>
    </form>
</body>
</html>

[Shanth]

Hi

Do you have a solution for the above Question. i have posted.

Please Replay, thank you

[Daniil]

Repeat myself, no. RowNumberer column doesn't use any DataIndex.

Why can't you use the solution I suggested?