[CLOSED] Remote paging with handler.

[stoque]

Hi guys,

After adding the handler, my grid don't render the rows.




Code:

Inicial.cs

public void MontaColunasGrid(List<documento> documentos, string nomeTipoDocumento)
        {
            DataTable dtDocumentos = new DataTable();

            Store StoreDocumento = Componentes.CriarStore("StoreDocumento");

            Ext.Net.GridPanel gridPanel = Componentes.CriarGridPanel(StoreDocumento, DateTime.Now.Millisecond, "Documento");
            //gridPanel.Listeners.RowContextMenu.Handler = "e.preventDefault(); #{" + this.RowContextMenu.ID + "}.dataRecord = this.store.getAt(rowIndex);#{" + this.RowContextMenu.ID + "}.showAt(e.getXY()); this.getSelectionModel().selectRow(rowIndex);";

            dtDocumentos.Columns.Add("id");
            AdicionarField(StoreDocumento, new RecordField("id"));

            dtDocumentos.Columns.Add("nome");
            AdicionarField(StoreDocumento, new RecordField("nome"));            

            using (ServicoECMClient proxy = new ServicoECMClient())
            {                           
                foreach (var doc in documentos)
                {
                    foreach (var documentoIndice in doc.documento_indice)
                    {
                        indice indice = proxy.ObterIndiceId(documentoIndice.id_indice);

                        if (!dtDocumentos.Columns.Contains(indice.nome))
                        {
                            this.AdicionarField(StoreDocumento,new RecordField(indice.nome));

                            dtDocumentos.Columns.Add(new DataColumn(indice.nome) { ColumnName = indice.nome });

                            gridPanel.ColumnModel.Columns.Add(new Column { DataIndex = indice.nome, Header = indice.nome });
                        }
                    }                    
                }
            }      

            foreach (var doc in documentos)
            {
                int i = 2; 
                DataRow row = dtDocumentos.NewRow();
                
                row[0] = doc.id;
                row[1] = doc.nome;
                foreach (var item in doc.documento_indice)
                {
                    row[i] = item.valor;
                    i++;
                }
                dtDocumentos.Rows.Add(row);
            }

            StoreDocumento.DataSource = dtDocumentos;
            StoreDocumento.DataBind();

            Ext.Net.Panel tabPanel = Componentes.CriarTabPanel(2, nomeTipoDocumento);
            TabPanelGeral.Add(tabPanel);
            tabPanel.Add(gridPanel);
            tabPanel.Render();
            gridPanel.Render();
            TabPanelGeral.SetActiveTab(tabPanel);
        }

Componentes.cs

public static Store CriarStore(string ID)
        {
            HttpProxy httpProxy = new HttpProxy();
            httpProxy.Url = "PaginacaoHandler.ashx";

            Ext.Net.JsonReader jsonReader = new Ext.Net.JsonReader();
            jsonReader.TotalProperty = "total";
            jsonReader.Root = "rows";

            Store store = new Store();
            store.ID = ID;
            store.AutoLoad = false;
            store.RemotePaging = true;
            store.Proxy.Add(httpProxy);
            store.Reader.Add(jsonReader);

            return store;
        }

Handler

public class PaginacaoHandler : StoqueECMWeb.Inicial, IHttpHandler, IReadOnlySessionState
{
    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/json";

        List<documento> documentos = null;

        string strJsonBusca = (string)context.Session["jsonBusca"];

        string nomeTipoDocumento = "";

        int inicio = 0;
        int limite = 10;
        int total = 0;

        if (!string.IsNullOrEmpty(context.Request["start"]))
        {
            inicio = int.Parse(context.Request["start"]);
        }

        if (!string.IsNullOrEmpty(context.Request["limit"]))
        {
            limite = int.Parse(context.Request["limit"]);
        }
        
        try
        {
            if (String.IsNullOrEmpty(strJsonBusca))
                return;

            DocumentoBusca documentoBusca = JsonConvert.DeserializeObject<DocumentoBusca>(strJsonBusca);

            strJsonBusca = JSON.Serialize(documentoBusca);

            using (ServicoECMClient proxy = new ServicoECMClient())
            {
                documentos = proxy.BuscarDocumento(out total, strJsonBusca).ToList();
                tipodocumento tipoDocumento = proxy.ObterTipoDocumento(documentoBusca.TipoDocumentoBusca[0]);
                nomeTipoDocumento = tipoDocumento.nome;
            }
            if (documentos.Count > 0)
            {
                this.MontaColunasGrid(documentos, nomeTipoDocumento);
            }
        }
        catch { }
        
        context.Response.Write(string.Format("{{total:{1},'rows':{0}}}", Ext.Net.JSON.Serialize(documentos), total));
    }
}

Any suggestion?

Thanks!!!

[Daniil]

Hi,

Please add the following AfterRender listener for the PagingToolbar.

<ext:PagingToolbar runat="server" PageSize="3">
    <Listeners>
        <AfterRender 
            Handler="this.refresh.handler = function () {
                            this.store.reload();
                        }" />
    </Listeners>
</ext:PagingToolbar>

[stoque]

Hi daniil,

Unfortunately does not work.

More any suggestion?

Thanks!!

public static Ext.Net.GridPanel CriarGridPanel(Ext.Net.Store store, int controleID, string titulo, int largura = 750, int altura = 350)
        {

            Ext.Net.GridPanel gridPanel = new GridPanel();
            gridPanel.ID = string.Concat("GridPanel", controleID.ToString());
            gridPanel.Title = titulo;
            gridPanel.Width = largura;
            gridPanel.Height = altura;
            gridPanel.TrackMouseOver = true;
            gridPanel.StripeRows = true;
            
            gridPanel.Store.Add(store);

            gridPanel.LoadMask.ShowMask = true;
            gridPanel.SaveMask.ShowMask = true;
          
            Ext.Net.GridView gridView = new Ext.Net.GridView();
            gridView.ID = string.Concat("GridView", controleID.ToString());
            gridView.ScrollOffset = 2;

            Ext.Net.RowSelectionModel rowSelectionModel = new RowSelectionModel();
            rowSelectionModel.ID = string.Concat("RowSelectionModel", controleID.ToString());
            rowSelectionModel.DirectEvents.RowSelect.Delay = 100;

            Ext.Net.ToolbarSpacer toolbarSpacer = new ToolbarSpacer();
            toolbarSpacer.ID = string.Concat("ToolbarSpacer", controleID.ToString());
            toolbarSpacer.Width = 10;           

            Ext.Net.Label label = CriarLabel(controleID,"Label");

            Ext.Net.PagingToolbar pagingToolbar = new PagingToolbar();
            pagingToolbar.ID = string.Concat("PagingToolbar", controleID.ToString());
            pagingToolbar.Listeners.AfterRender.Handler = "this.refresh.handler = function () { #{" + store.ID.ToString() + "}.reload(); }";
           

            Ext.Net.ComboBox comboBox = Componentes.CriarComboBox(controleID, "comboBox", 100);
           
            comboBox.Items.Add(new Ext.Net.ListItem { Text = "1", Value = "1" });
            comboBox.Items.Add(new Ext.Net.ListItem { Text = "5", Value = "5" });
            comboBox.Items.Add(new Ext.Net.ListItem { Text = "10", Value = "10" });
            comboBox.Items.Add(new Ext.Net.ListItem { Text = "20", Value = "20" });
            comboBox.Items.Add(new Ext.Net.ListItem { Text = "40", Value = "40" });        

            comboBox.SelectedItem.Value = "5";
           

            comboBox.Listeners.Select.Handler = "#{"+pagingToolbar.ID.ToString()+"}.pageSize = parseInt(this.getValue()); #{"+pagingToolbar.ID.ToString()+"}.doLoad();";

            pagingToolbar.Items.Add(label);
            pagingToolbar.Items.Add(toolbarSpacer);
            pagingToolbar.Items.Add(comboBox);          
           
            
            gridPanel.SelectionModel.Add(rowSelectionModel);
            gridPanel.BottomBar.Add(pagingToolbar);
            gridPanel.View.Add(gridView);
                       
            return gridPanel;
        }

[Daniil]

Please clarify how exactly it does not work: any errors?, exceptions?, do you see a load request (please use Fiddler or Firebug)?.

[stoque]

Hi Daniil,

There were no exception and error.

The store of the grid is empty in first response.

Look:



After loaded grid I click on refresh and the store is populated, but the grid not renderize the values.

Observation:

I removed the proxy of the grid. Work well.

Look:

public static Store CriarStore(string ID)
        {
            HttpProxy httpProxy = new HttpProxy();
            httpProxy.Url = "PaginacaoHandler.ashx";

            Ext.Net.JsonReader jsonReader = new Ext.Net.JsonReader();
            jsonReader.TotalProperty = "total";
            //jsonReader.Root = "rows";

            Store store = new Store();
            store.ID = ID;
            store.AutoLoad = false;
            store.RemotePaging = true;
            
            //store.Proxy.Add(httpProxy);
            store.Reader.Add(jsonReader);

            return store;
        }

[Daniil]

I can't see where you add RecordFields into JsonReader.

Please provide a full (but simplified) code sample to reproduce the problem.

[stoque]

Hi Daniil,

There were no exception and error.

The store of the grid is empty in first response.

Look:



After loaded grid I click on refresh and the store is populated, but the grid not renderize the values.

Observation:

I removed the proxy of the grid. Work well.

Look:

public static Store CriarStore(string ID)
        {
            HttpProxy httpProxy = new HttpProxy();
            httpProxy.Url = "PaginacaoHandler.ashx";

            Ext.Net.JsonReader jsonReader = new Ext.Net.JsonReader();
            jsonReader.TotalProperty = "total";
            //jsonReader.Root = "rows";

            Store store = new Store();
            store.ID = ID;
            store.AutoLoad = false;
            store.RemotePaging = true;
            
            //store.Proxy.Add(httpProxy);
            store.Reader.Add(jsonReader);

            return store;
        }

[Daniil]

The store of the grid is empty in first response.

Well, it is because you set AutoLoad="false" for the Store.

store.AutoLoad = false;

After loaded grid I click on refresh and the store is populated, but the grid not renderize the values.

Please double ensure that RecordField-s names are the same as DataIndex-es of ColumnModel's Columns.

Please also post a response from HttpProxy.

[stoque]

Hi,

Well, it is because you set AutoLoad="false" for the Store.
1
store.AutoLoad = false;

Yes, but I make a request. After I do a refresh on the grid.

First request: The collumns are created, but the rows don't created.



Second request (after refresh grid)



Thanks!!!!

[Daniil]

I see SimpleStore in the first request. It should not be if the Store is configured with HttpProxy.

And the Store is configured with AutoLoad="false". So, it's a expected thing that data is not loaded before you click on the Refresh button.

In according to the second request, you should uncomment:

//jsonReader.Root = "rows";