How can i get the index of the row when all i have its a id?

[Tanielian]

Hi,

I have a GridPanel i'm using the methods

var RefreshSelectedItens = function (gridPanel) {
           for (var i = 0; i < SelectedRows.length; i++) {
               var row = //i have to get the row here based on SelectedRows[i]
               if (row != null) {
                   row.getElementsByTagName("div")[1].innerHTML = i + 1;
               }
           }
       }

SelectedRows is a list of ids...

this ids are the correlative record.id (o got then another time, and outed on this list)...

theres some way to do that?

[Tanielian]

Or could be some event that occours when:

U select a row then goes to the next page, the come back... then it starts to reselect the rows... witch event is this?

[Tanielian]

Look...

What i need to do is:

When the user selects a row i have to keep track of the order that he is doing that... so...
I erased the image of the checker...

        .x-grid3-row-checker
        {
            background-image: url() !important;
            text-align: center;
        }

And got the on Select and Deselect events...

<ext:GridPanel>
    ...
    <SelectionModel>
        <ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" runat="server">
            <Listeners>
                <RowSelect Handler="AdicionaFoco(#{GridPanel1}, rowIndex, record);" />
                <RowDeselect Handler="RemoveFoco(#{GridPanel1}, rowIndex, record);" />
            </Listeners>
        </ext:CheckboxSelectionModel>
    </SelectionModel>
</ext:GridPanel>

These r the events...

        var LinhasEmFoco = new Array();

        var AdicionaFoco = function (gridObj, indexDaLinha, record) {
            if (LinhasEmFoco.indexOf(record.id) == -1) {
                LinhasEmFoco.push(record.id);
            }
            gridObj.getView().getRow(indexDaLinha).getElementsByTagName("div")[1].innerHTML = LinhasEmFoco.indexOf(record.id) + 1;
            gridObj.getView().getRow(indexDaLinha).getElementsByTagName("div")[1].id = "linhaEmFoco_" + record.id;
        }

        var RemoveFoco = function (gridObj, indexDaLinha, record) {
            LinhasEmFoco.remove(record.id);
            gridObj.getView().getRow(indexDaLinha).getElementsByTagName("div")[1].innerHTML = "";
            gridObj.getView().getRow(indexDaLinha).getElementsByTagName("div")[1].id = "";

            AtualizaFocos(gridObj);
        }

        var AtualizaFocos = function (gridPanel) {
            for (var i = 0; i < LinhasEmFoco.length; i++) {
                document.getElementById("linhaEmFoco_" + LinhasEmFoco[i]).innerHTML = i + 1;
            }
        }

Works just fine whem im on a single page... but when i change pages... =/
I have to find a way to keep that... well... i have all the ids on the list so.. i thought...
i jut have to modify the AtualizaFocos (RefreshFocused) event to be independent of the id that i put on the div (coz this one is going to be erased as soon i go to the next page) and be dependent of the id of the record (find a way to get the row based on the record id), this way i would be able to set the order right. and call this event (AtualizaFocos) when he navigate through pages, or sort collumns...

i found the sortEvent OF THE GridPanel..

<Listeners><SortChange Handler="" /></Listeners>

any more doubts?

hehe....

thanks in advance....

[Tanielian]

Well...

        var AtualizaFocos = function (gridPanel) {
            var tamanhoDaPagina = PagingToolBar1.pageSize;//pageSize
            var paginaAtual = Math.ceil((PagingToolBar1.cursor + tamanhoDaPagina) / tamanhoDaPagina);//ActivePage

            var indiceMenor = (paginaAtual - 1) * tamanhoDaPagina;//Lowest index on this page...
            var indiceMaior = (paginaAtual * tamanhoDaPagina) - 1;//Higher index on the page...

            for (var i = 0; i < LinhasEmFoco.length; i++) {//for each id saved before...
                var indice = gridPanel.selectedIds[LinhasEmFoco[i]].index;// get its index...

                if (indice >= indiceMenor && indice <= indiceMaior) { // if the index is on this page...
                    var linha = gridPanel.getView().getRow(indice - indiceMenor);//get row
                    if (linha != null) {
                        linha.getElementsByTagName("div")[1].innerHTML = i + 1; //set the text to the position on the list. XD
                    }
                }
            }
        }

This was the best way so far... i call that on the Change event of the pagingToolBar... and on the SortChange of the GridPanel...

It works just fine when I'm navigating through pages... coz the index on the 'gridPanel.selectedIds' r correct...

But...

when i sort the grid, if the row its going to stay on the same page, the element change the index on the 'gridPanel.selectedIds', but if with the sort he gonne to some other page... than the index of this id on the 'gridPanel.selectedIds' don't change... making my code not work correctly...

is it a bug on the 'gridPanel.selectedIds' that dont keep the right indexes when the grid its sorted?

Thanks in advance...

[Daniil]

Hello!

I don't think this is a bug. It rather doesn't support this:)

What about this workaround?

To be honest I didn't fully tested it but it should work.

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.Store.Primary;
            store.DataSource = new object[] { 
                                         new object[] {"1", "test12", "test13"},
                                         new object[] {"3", "test22", "test23"},
                                         new object[] {"2", "test32", "test33"},
                                         new object[] {"4", "test42", "test43"},
                                         new object[] {"5", "test52", "test53"},
                                         new object[] {"6", "test62", "test63"}
                                };
            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" 
        Width="300">
        <Store>
            <ext:Store runat="server">
                <Reader>
                    <ext:ArrayReader IDProperty="test1">
                        <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" />
                <ext:Column Header="Test2" DataIndex="test2" />
                <ext:Column Header="Test3" DataIndex="test3" />
            </Columns>
        </ColumnModel>
        <SelectionModel>
            <ext:CheckboxSelectionModel runat="server" />
        </SelectionModel>
        <BottomBar>
            <ext:PagingToolbar runat="server" PageSize="2" />
        </BottomBar>
        <Buttons>
            <ext:Button runat="server" Text="selectedIds">
                <Listeners>
                    <Click Handler="alert(Ext.encode(#{GridPanel1}.selectedIds))" />
                </Listeners>
            </ext:Button>
        </Buttons>
        <Listeners>
            <SortChange 
                Handler="for (var id in #{GridPanel1}.selectedIds) {
                            GridPanel1.selectedIds[id].index = #{GridPanel1}.store.allData.indexOfKey(id);
                         }"/>
        </Listeners>
    </ext:GridPanel>
    </form>
</body>
</html>

[Tanielian]

Hi,

Ty a lot for ur reply...

this is how the code ended:

        var AtualizaFocos = function (gridPanel) {
            for (var i = 0; i < LinhasEmFoco.length; i++) {
                var indice = gridPanel.store.indexOfId(LinhasEmFoco[i]);

                var linha = gridPanel.getView().getRow(indice);
                if (linha != null) {
                    linha.getElementsByTagName("div")[1].innerHTML = i + 1;
                }
            }
        }

just updated the function... ty a lot... really.. a lot...