I am using devexpress datagrid in a master/detail form

It is a kind of Invoice, where I am adding products to the detail grid, we are using v2.5 with adapter.

We added a Business layer for searching, that returns the product or products that will be added, so on the web form we have an ADD button that displays a control where user search for a product, in case there is more than one match, we show on a combobox the products that where found and the user can select the right one.

We are having problems because it takes up to 20 seconds to make the search and fill the combobox. We are not using postbacks, only AJAX enabled controls, but it makes the application unusable for the timing.

So we would like to know if we are doing things on the recomended way, this is the code that returns the list of products to the control for searching:

public static EntityCollection buscarMaterial(String nombre, Int32 idCategoria)
        {
            //DataTable tabla = new DataTable();
            EntityCollection materiales = new EntityCollection(new MaterialEntityFactory());
            DataAccessAdapter adapter = new DataAccessAdapter();
            // FILTRO
            IRelationPredicateBucket bucket = new RelationPredicateBucket();
            if (!String.IsNullOrEmpty(nombre))
            {
                nombre = '%' + nombre + '%';
                bucket.PredicateExpression.Add(MaterialFields.Nombre % nombre);
            }

            IRelationPredicateBucket bucket2 = new RelationPredicateBucket();
            EntityCollection clasificacion = lertek.business.CatalogoManager.obtenerCategoria(idCategoria);
            foreach (CategoriaEntity objCat in clasificacion)
            {
                bucket2.PredicateExpression.AddWithOr(MaterialFields.Categoria == objCat.Id);
            }
            bucket.PredicateExpression.AddWithAnd(bucket2.PredicateExpression);

            // SORTER
            SortExpression sorter = new SortExpression();
            sorter.Add(MaterialFields.Nombre | SortOperator.Ascending);
            sorter[0].CaseSensitiveCollation = false;

            adapter.FetchEntityCollection(materiales, bucket, 0, sorter);
            adapter.CloseConnection();
            return materiales;
        }

This function is called from the edit form in a textbox where it populates a Combobox in case that more than one entity is found, this is the function we use on the form:

[Anthem.Method]
    protected string buscarMaterial(string nombre)
    {
        EntityCollection ec = lertek.almacen.MaterialManager.buscarMaterial(nombre, Convert.ToInt32(ConfigurationManager.AppSettings["categoriaAlamacen"]));
        Context.Session.Remove("mtoMaterialBuscar");
        Context.Session.Add("mtoMaterialBuscar", ec);
        if (ec != null && ec.Items.Count == 1)
        {
            MaterialEntity objMaterial = (MaterialEntity)ec.Items[0];
            nombre = objMaterial.Nombre;
            ddlMaterial.Items.Clear();
            ddlMaterial.Items.Add("- Material encontrado con exito. -");
            mostrarPrecioMaterial(objMaterial);
        }
        else if (ec != null && ec.Items.Count > 1)
        {
            this.ddlMaterial.DataSource = ec;
            this.ddlMaterial.DataTextField = "Nombre";
            this.ddlMaterial.DataValueField = "Id";
            this.ddlMaterial.DataBind();
            this.ddlMaterial.Items.Insert(0, new ListItem("- Seleccione -"));
        }
        else
        {
            ddlMaterial.Items.Clear();
            ddlMaterial.Items.Add("- No se encontraron Materiales con ese nombre -");
        }
        ddlMaterial.UpdateAfterCallBack = true;
        return nombre;
    }

Then on the ASPX we have a button that shows the quantity and product searchbox so we have this code on the ASPX

 <script type="text/javascript" language="javascript">
    function materialCambio(source, evnt)
    {
        Anthem_InvokePageMethod(
                            'cambioMaterial', 
                            [source.GetValue(), source.GetSelectedIndex()],
                            function(result) { 
                            } 
                        );
    }
    
    function buscaMaterial(evento)
        {
            if(evento.keyCode == 13)
                Anthem_InvokePageMethod(
                                        'buscarMaterial', 
                                        [document.getElementById("tbMaterial").value],
                                        function(result) { 
                                            document.getElementById("tbMaterial").value = result.value;
                                        } 
                                    );
        }
    
    function mostrarPopupMaterial()
    {
        document.getElementById("<%=tbTipo.ClientID %>").value = "";
        document.getElementById("tbMaterial").value = "";
        document.getElementById("<%=tbCantidad.ClientID %>").value = "";
        document.getElementById("<%=tbPrecioUnitario.ClientID %>").value = "";
        document.getElementById("<%=tbIva.ClientID %>").value = "";
        document.getElementById("<%=idMaterial.ClientID %>").value = "";
        document.getElementById("<%=ddlMaterial.ClientID %>").selectedIndex = 0;
        document.getElementById("<%=ddlUnidad.ClientID %>").selectedIndex = 0;
        popupMaterial.Show();
    }
        
    function nuevoMaterial()
    {
        Anthem_InvokePageMethod(
                            'guardarMaterial', 
                            [],
                            function(result) { 
                            } 
                        );
    }   
    
    function borrarMaterial()
        {
            Anthem_InvokePageMethod(
                            'borrarMateriales', 
                            [],
                            function(result) { 
                            } 
                        );
        }
</script>

This is the code we have for the detail and grid

 <TabPages>
            <dxtc:TabPage Name="Materiales" Text="Materiales" >
                <Controls>
                    <div class="divBotonArea">
                        <dxe:ASPxHyperLink ID="hlAgregarMaterial" runat="server" Text="Agregar" CssClass="botonLink">
                            <ClientSideEvents Click="function(s, e) {mostrarPopupMaterial();}" />
                        </dxe:ASPxHyperLink>
                        <dxe:ASPxHyperLink ID="hlBorrarMaterial" runat="server" Text="Borrar" CssClass="botonLink">
                            <ClientSideEvents Click="function(s, e) { borrarMaterial(); }" />
                        </dxe:ASPxHyperLink>
                    </div>
                    <dxwgv:ASPxGridView ID="gridMateriales" runat="server" AutoGenerateColumns="False"
                        DataSourceID="srcMateriales" KeyFieldName="Id" OnCustomUnboundColumnData="gridMateriales_CustomUnboundColumnData" CssFilePath="~/App_Themes/Plastic Blue/{0}/styles.css" CssPostfix="PlasticBlue" ClientInstanceName="gridMateriales" OnCustomCallback="gridMateriales_CustomCallback" Width="100%">
                        <Columns>
                            <dxwgv:GridViewCommandColumn VisibleIndex="0" ShowSelectCheckbox="True">
                                <EditButton Text="E" Visible="True">
                                </EditButton>
                                <ClearFilterButton Visible="True">
                                </ClearFilterButton>
                            </dxwgv:GridViewCommandColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Id" FieldName="Id" ReadOnly="True" Visible="False"
                                VisibleIndex="1">
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Tipo" FieldName="Tipo" VisibleIndex="1">
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Servicio" FieldName="Servicio" ReadOnly="True"
                                Visible="False" VisibleIndex="2">
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataComboBoxColumn Caption="Material" FieldName="Material" VisibleIndex="2">
                                <PropertiesComboBox DataSourceID="srcRefacciones" TextField="Nombre" ValueField="Id"
                                    ValueType="System.Int32">
                                    <ClientSideEvents SelectedIndexChanged="function(s, e) { materialCambio(s, e); }" />
                                </PropertiesComboBox>
                            </dxwgv:GridViewDataComboBoxColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Cantidad" FieldName="Cantidad" VisibleIndex="3">
                                <PropertiesTextEdit>
                                    <ValidationSettings CausesValidation="True" ErrorText="Valor invaldo">
                                    </ValidationSettings>
                                </PropertiesTextEdit>
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataComboBoxColumn Caption="Unidad" FieldName="Unidad" VisibleIndex="4">
                                <PropertiesComboBox DataSourceID="srcUnidades" TextField="Iniciales" ValueField="Id"
                                    ValueType="System.Int32">
                                </PropertiesComboBox>
                                <EditItemTemplate>
                                    <anthem:DropDownList ID="ddlUnidad" runat="server" DataSourceID="srcUnidades" DataTextField="Iniciales" DataValueField="Id" AutoUpdateAfterCallBack=true SelectedValue='<%# Bind("Unidad") %>'>
                                    </anthem:DropDownList>
                                </EditItemTemplate>
                            </dxwgv:GridViewDataComboBoxColumn>
                            <dxwgv:GridViewDataTextColumn Caption="PrecioUnitario" FieldName="PrecioUnitario"
                                VisibleIndex="5">
                                <PropertiesTextEdit DisplayFormatString="c2">
                                </PropertiesTextEdit>
                                <EditItemTemplate>
                                    <anthem:TextBox ID="tbPrecioUnitario" runat="server" AutoUpdateAfterCallBack=true Text='<%# Bind("PrecioUnitario") %>'></anthem:TextBox>
                                </EditItemTemplate>
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Iva Producto" FieldName="Iva"
                                VisibleIndex="6">
                                <PropertiesTextEdit DisplayFormatString="c2">
                                </PropertiesTextEdit>
                                <EditItemTemplate>
                                    <anthem:TextBox ID="tbIva" runat="server" AutoUpdateAfterCallBack=true Text='<%# Bind("Iva") %>'></anthem:TextBox>
                                </EditItemTemplate>
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Retencion" FieldName="Retencion" Visible="False"
                                VisibleIndex="7">
                                <EditItemTemplate>
                                    <anthem:TextBox ID="tbRetencion" runat="server" AutoUpdateAfterCallBack=true Text='<%# Bind("Retencion") %>'></anthem:TextBox>
                                </EditItemTemplate>
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Observaciones" FieldName="Observaciones" VisibleIndex="7">
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="IdReferencia" FieldName="IdReferencia" VisibleIndex="8" Visible="False">
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="EntReferencia" FieldName="EntReferencia" VisibleIndex="8" Visible="False">
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="SubTotal" FieldName="SubTotal" ReadOnly="True" UnboundType="Decimal"
                                VisibleIndex="8">
                                <PropertiesTextEdit DisplayFormatString="c2">
                                </PropertiesTextEdit>
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Iva" FieldName="SubIva" ReadOnly="True" UnboundType="Decimal"
                                VisibleIndex="9">
                                <PropertiesTextEdit DisplayFormatString="c2">
                                </PropertiesTextEdit>
                            </dxwgv:GridViewDataTextColumn>
                            <dxwgv:GridViewDataTextColumn Caption="Total" FieldName="Total" ReadOnly="True" UnboundType="Decimal"
                                VisibleIndex="10">
                                <PropertiesTextEdit DisplayFormatString="c2">
                                </PropertiesTextEdit>
                            </dxwgv:GridViewDataTextColumn>
                        </Columns>
                        <Settings ShowFilterRow="True" ShowGroupPanel="True" />
                        <TotalSummary>
                            <dxwgv:ASPxSummaryItem FieldName="Total" ShowInColumn="Total" SummaryType="Sum" DisplayFormat="c2" />
                            <dxwgv:ASPxSummaryItem FieldName="Cantidad" ShowInColumn="Cantidad" SummaryType="Sum" />
                            <dxwgv:ASPxSummaryItem FieldName="SubTotal" ShowInColumn="SubTotal" SummaryType="Sum" DisplayFormat="c2" />
                            <dxwgv:ASPxSummaryItem FieldName="SubIva" ShowInColumn="SubIva" SummaryType="Sum" DisplayFormat="c2" />
                        </TotalSummary>
                        <Settings ShowFooter="true" />
                        <SettingsPager ShowDefaultImages="False">
                            <AllButton Text="All">
                            </AllButton>
                            <NextPageButton Text="Next &gt;">
                            </NextPageButton>
                            <PrevPageButton Text="&lt; Prev">
                            </PrevPageButton>
                        </SettingsPager>
                        <Images ImageFolder="~/App_Themes/Plastic Blue/{0}/">
                            <CollapsedButton Height="9px" Url="~/App_Themes/Plastic Blue/GridView/gvCollapsedButton.png"
                                Width="9px" />
                            <ExpandedButton Height="9px" Url="~/App_Themes/Plastic Blue/GridView/gvExpandedButton.png"
                                Width="9px" />
                            <HeaderSortDown Height="11px" Url="~/App_Themes/Plastic Blue/GridView/gvHeaderSortDown.png"
                                Width="11px" />
                            <HeaderSortUp Height="11px" Url="~/App_Themes/Plastic Blue/GridView/gvHeaderSortUp.png"
                                Width="11px" />
                        </Images>
                        <Styles CssFilePath="~/App_Themes/Plastic Blue/{0}/styles.css" CssPostfix="PlasticBlue">
                            <Header ImageSpacing="10px" SortingImageSpacing="10px">
                            </Header>
                        </Styles>
                    </dxwgv:ASPxGridView>
                </Controls>
            </dxtc:TabPage>

We would like to know if there is a better way to add elements to a grid using ajax since on the search it is taking a lot of time

Regards

Hi wexa,

Could you identify where the bottleneck is? Where the process spends a lot of time?

As you are storing the _idCategoria _at AppSettings["categoriaAlamacen"] I think the _buscarMaterial _method shouldn't look for the same _Categoria EntityCollectio_n each time.

Please debug and see where you should focus to increase the performance. Maybe looking at Generated SQL could give you a hint.