This is a migrated thread and some comments may be shown as answers.

After Grid Populated With AJAX Page stops functioning

3 Answers 26 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Daniel
Top achievements
Rank 1
Daniel asked on 27 Nov 2013, 02:10 PM
Hello good people,

I'm having a problem with a ajaxfied grid on ASP.NET, I'm able to populate the grid first time on Page Load (without ajax), and then again using the form to filter the records displayed on page (this WITH ajax), the grid IS populated, but then all controls on page stops responding.

Target framework .net 4.5

Any advice will help.

Code is posted here below.

Thanks in advance!

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DashboardContabilidade.aspx.cs" Inherits="GaragemMaintenance.DashboardContabilidade" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%--<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>--%>
 
<!DOCTYPE html>
<head id="Head1" runat="server">
<title>Dashboard Estapar</title>
<script src="Scripts/jquery-2.0.3.js"></script>
<%--<script src="Scripts/jquery-ui-1.10.3.js"></script>--%>
<%--<link href="Content/themes/base/jquery-ui.css"  rel="stylesheet" type="text/css"/>--%>
<%--<link type="text/css" rel="stylesheet" href="Content/themes/css/style.css" />--%>
<%--<link rel='stylesheet' type='text/css' href='Styles/StaticHeader.css' />--%>
<style>
.hidden
{
    display: none;
}
 
body
{
    /*background: #FFF;
    color: #000;*/
    font: normal normal 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
    /*margin: 10px;*/
    padding: 0;
}
 
td
{
    font: normal normal 9px Verdana, Geneva, Arial, Helvetica, sans-serif;
}
 
th
{
    font: normal normal 9px Verdana, Geneva, Arial, Helvetica, sans-serif;
}
 
.ImageButtons
{
    padding-top: 5px;
    padding-right: 5px;
}
</style>
<script>
function onRequestStart(sender, args) {
    if (args.get_eventTarget().indexOf("Export") >= 0) {
        args.set_enableAjax(false);
    }
}
</script>
</head>
<body>
<form id="form1" runat="server" style="background-color: white;">
    <input id="scrollPos" runat="server" type="hidden" value="0" />
    <div>
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            <Scripts>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
            </Scripts>
            <Services>
                <asp:ServiceReference Path="DataManager.svc" />
            </Services>
        </telerik:RadScriptManager>
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <ClientEvents OnRequestStart="onRequestStart" />
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="radGrdContabil_GridHeader">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="pnlGrid" LoadingPanelID="loadingPanel"/>
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="radGrdContabil">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="radGrdContabil" LoadingPanelID="loadingPanel"/>
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="btnFiltrar">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="pnlMain" LoadingPanelID="loadingPanel"/>
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="btnExportExcel">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="btnExportExcel" LoadingPanelID="loadingPanel"/>
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="btnExportPdf">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="btnExportPdf" LoadingPanelID="loadingPanel"/>
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="btnExportWord">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="btnExportWord" LoadingPanelID="loadingPanel"/>
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="btnExportCsv">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="btnExportCsv" LoadingPanelID="loadingPanel"/>
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadAjaxLoadingPanel ID="loadingPanel" runat="server" Height="75px" Width="75px" Transparency="25">
            <img alt="Carregando..." style="border:0;" src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading.gif") %>' />
        </telerik:RadAjaxLoadingPanel>
        <telerik:RadFormDecorator ID="RadFormDecorator1" DecoratedControls="All" runat="server" Skin="Office2010Silver" EnableRoundedCorners="true" />
        <telerik:RadNotification ID="radNotification" runat="server" EnableRoundedCorners="true" EnableShadow="true" Position="Center" Title="Aviso" Width="400" Height="150"
            Text="A execução desta consulta sem filtro retorna mais linhas do que o ERP consegue exportar, por favor selecione algum outro filtro.">
        </telerik:RadNotification>
        <telerik:RadNotification ID="radNotificationData" runat="server" EnableRoundedCorners="true" Position="Center" Title="Aviso" Width="400" Height="150"
            EnableShadow="true" Text="A execução desta consulta exige ao menos um filtro de data.">
        </telerik:RadNotification>
        <div>
            <asp:Label ID="Label1" runat="server" Text="DashBoard Contabilidade" Font-Bold="True" Font-Size="20pt"></asp:Label>
        </div>
        <telerik:RadAjaxPanel runat="server" ID="pnlMain">
            <div>
                <table style="width: 1100px">
                    <tr>
                        <td>
                            <table class="" style="width: 700px">
                                <tr>
                                    <td colspan="5">
                                        <p></p>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="4">
                                        <asp:Label ID="Label5" runat="server" Text="Datas:"></asp:Label>
                                    </td>
                                    <td rowspan="8">
                                        <table style="width: 150px; position: relative">
                                            <tr>
                                                <td style="width: 50px">
                                                    <asp:ImageButton runat="server" ID="btnExportExcel" OnClick="btnExportExcel_Click" CssClass="ImageButtons" ImageUrl="~/Images/file-extension-xls-html-icon.png" />
                                                </td>
                                                <td style="width: 50px">
                                                    <asp:ImageButton runat="server" ID="btnExportPdf" OnClick="btnExportPdf_Click" CssClass="ImageButtons" ImageUrl="~/Images/file-extension-pdf-icon.png" />
                                                </td>
                                                <td style="width: 50px">
                                                    <asp:ImageButton runat="server" ID="btnExportWord" OnClick="btnExportWord_Click" CssClass="ImageButtons" ImageUrl="~/Images/file-extension-doc-icon.png" />
                                                </td>
                                                <td style="width: 50px">
                                                    <asp:ImageButton runat="server" ID="btnExportCsv" OnClick="btnExportCsv_Click" CssClass="ImageButtons" ImageUrl="~/Images/file-extension-csv-icon.png" />
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <asp:Label ID="Label4" runat="server" Text="Mês De:"></asp:Label>
                                    </td>
                                    <td>
                                        <telerik:RadMonthYearPicker ID="mesDe" runat="server" Culture="pt-BR" DateInput-Culture="pt-BR" DateInput-DateFormat="MM/yyyy"
                                            Skin="Office2010Silver" MonthYearNavigationSettings-TodayButtonCaption="Hoje" Width="95px" />
                                    </td>
                                    <td>
                                        <asp:Label ID="Label6" runat="server" Text="Mês Até:"></asp:Label></td>
                                    <td>
                                        <telerik:RadMonthYearPicker ID="mesAte" runat="server" Culture="pt-BR" DateInput-Culture="pt-BR" DateInput-DateFormat="MM/yyyy"
                                            Skin="Office2010Silver" MonthYearNavigationSettings-TodayButtonCaption="Hoje" Width="95px" />
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="4">
                                        <asp:Label ID="Label9" runat="server" Text="Contas:"></asp:Label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <asp:Label ID="Label7" runat="server" Text="De:"></asp:Label>
                                    </td>
                                    <td>
                                        <asp:DropDownList ID="ddlContasDe" runat="server" Font-Size="9px" Font-Names="Verdana" DataTextField="Descricao" DataValueField="CT1_CONTA" Width="300px" />
                                    </td>
                                    <td>
                                        <asp:Label ID="Label8" runat="server" Text="Até:"></asp:Label></td>
                                    <td>
                                        <asp:DropDownList ID="ddlContasAte" runat="server" Font-Size="9px" Font-Names="Verdana" DataTextField="Descricao" DataValueField="CT1_CONTA" Width="300px" />
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="4">
                                        <asp:Label ID="Label13" runat="server" Text="Centro de Custo:"></asp:Label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <asp:Label ID="Label12" runat="server" Text="De:"></asp:Label>
                                    </td>
                                    <td>
                                        <asp:DropDownList ID="ddlCentrosDe" runat="server" Font-Size="9px" Font-Names="Verdana" DataTextField="Descricao" DataValueField="CTT_CUSTO" Width="300px" />
                                    </td>
                                    <td>
                                        <asp:Label ID="Label2" runat="server" Text="Até:"></asp:Label>
                                    </td>
                                    <td>
                                        <asp:DropDownList ID="ddlCentrosAte" runat="server" Font-Size="9px" Font-Names="Verdana" DataTextField="Descricao" DataValueField="CTT_CUSTO" Width="300px" />
                                    </td>
                                </tr>
                                <tr>
                                    <td style="width: 50px"></td>
                                    <td>
                                        <asp:Button ID="btnFiltrar" runat="server" Text="Filtrar" OnClick="btnFiltrar_Click" />
                                    </td>
                                    <td>
                                        <asp:Button ID="btnLimpar" runat="server" Text="Limpar" OnClick="btnLimpar_Click" />
                                    </td>
                                    <td>
                                        <asp:Button ID="btnMenu" runat="server" Text="Menu" OnClick="btnMenu_Click" />
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
                <p></p>
                <telerik:RadGrid ID="radGrdContabil" runat="server" Skin="Office2010Blue" Width="95%" Height="500px" AutoGenerateColumns="True" CellSpacing="0"
                    GridLines="None" AllowPaging="true" ShowHeader="true" Style="margin-left: 20px" ShowStatusBar="true" StatusBarSettings-LoadingText="Carregando"
                    PageSize="200" OnSortCommand="radGrdContabil_SortCommand" OnPageIndexChanged="radGrdContabil_PageIndexChanged"
                    OnPageSizeChanged="radGrdContabil_PageSizeChanged">
                    <ClientSettings>
                        <Scrolling AllowScroll="true" SaveScrollPosition="true" UseStaticHeaders="true" />
                    </ClientSettings>
                    <MasterTableView AutoGenerateColumns="True" EnableColumnsViewState="false" AllowSorting="true">
                        <PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
                        <NoRecordsTemplate>
                            <div>Não existem registros para os filtros selecionados!</div>
                        </NoRecordsTemplate>
                    </MasterTableView>
                </telerik:RadGrid>
            </div>
        </telerik:RadAjaxPanel>
    </div>
</form>
</body>
</html>

And the CS File

using System;
using System.Collections.Generic;
using System.Data;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;
/* adicionar o namespace para o .NET carregar o método extendido AuthRedirect */
using Estapar.Security;
using Estapar.Security.Web;
 
namespace GaragemMaintenance
{
    public partial class DashboardContabilidade : EstaparPage
    {
        public bool rebind = false;
        private const string sessionDataID = "ContabilData";
 
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                mesDe.SelectedDate = DateTime.Now;
                mesAte.SelectedDate = DateTime.Now;
 
                ddlContasDe.DataSource = DAO.GetContasCorrentes();
                ddlContasDe.DataBind();
                ddlContasDe.Items.Insert(0, new ListItem("Selecione...", ""));
 
                ddlContasAte.DataSource = DAO.GetContasCorrentes();
                ddlContasAte.DataBind();
                ddlContasAte.Items.Insert(0, new ListItem("Selecione...", ""));
 
                ddlCentrosDe.DataSource = DAO.GetCentroCustos();
                ddlCentrosDe.DataBind();
                ddlCentrosDe.Items.Insert(0, new ListItem("Selecione...", ""));
 
                ddlCentrosAte.DataSource = DAO.GetCentroCustos();
                ddlCentrosAte.DataBind();
                ddlCentrosAte.Items.Insert(0, new ListItem("Selecione...", ""));
 
                FillGrid(false);
            }
        }
 
        private void FillGrid(bool useCache)
        {
            DataTable res = new DataTable();
 
            try
            {
                if (!useCache || Session[sessionDataID] == null)
                {
                    res = DAO.GetDashboardDataContabilCC(mesDe.SelectedDate.Value, mesAte.SelectedDate.Value, ddlContasDe.SelectedValue, ddlContasAte.SelectedValue, ddlCentrosDe.SelectedValue, ddlCentrosAte.SelectedValue);
                    Session[sessionDataID] = res;
                }
                else
                {
                    res = (DataTable)Session[sessionDataID];
                }
 
                radGrdContabil.DataSource = res;
                radGrdContabil.ColumnCreated += radGrdContabil_ColumnCreated;
                radGrdContabil.DataBind();
            }
            catch (Exception Ex)
            {
                radNotification.Show(Ex.Message);
            }
        }
 
        private bool NenhumaData()
        {
            return ((!mesDe.SelectedDate.HasValue) && (!mesAte.SelectedDate.HasValue));
        }
 
        protected void btnFiltrar_Click(object sender, EventArgs e)
        {
            radNotification.Visible = false;
            if (NenhumaData())
            {
                radNotificationData.Show();
                return;
            }
 
            FillGrid(false);
        }
 
        void radGrdContabil_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
        {
            var col = e.Column;
 
            if (col.UniqueName == "ExpandColumn")
                e.Column.Visible = false;
 
            if (col.UniqueName == "CONTA")
            {
                col.HeaderStyle.Width = new Unit("60px");
                col.HeaderText = "Conta";
            }
            else if (col.UniqueName == "DESC_CONTA")
            {
                col.HeaderStyle.Width = new Unit("250px");
                col.HeaderText = "Nome Conta";
            }
            else if (col.UniqueName == "CENTRO_CUSTO")
            {
                col.HeaderStyle.Width = new Unit("60px");
                col.HeaderText = "Centro";
            }
            else if (col.UniqueName == "DESC_CC")
            {
                col.HeaderStyle.Width = new Unit("250px");
                col.HeaderText = "Nome Centro";
            }
            else if (col.UniqueName == "TOTAL")
            {
                col.HeaderStyle.Width = new Unit("60px");
                col.HeaderText = "Total";
            }
            else if (col.UniqueName.StartsWith("M"))
            {
                col.HeaderStyle.Width = new Unit("60px");
                col.HeaderText = col.UniqueName.Remove(0, 1).Insert(4, "-");
            }
        }
 
        protected void btnLimpar_Click(object sender, EventArgs e)
        {
            mesDe.SelectedDate = DateTime.Now;
            mesAte.SelectedDate = DateTime.Now;
            ddlContasDe.SelectedIndex = 0;
            ddlContasAte.SelectedIndex = 0;
            ddlCentrosDe.SelectedIndex = 0;
            ddlCentrosAte.SelectedIndex = 0;
        }
 
        private RadGrid PrepareGridToExport()
        {
            rebind = true;
            FillGrid(true);
 
            RadGrid gv = radGrdContabil;
 
            gv.ExportSettings.OpenInNewWindow = true;
            gv.ExportSettings.UseItemStyles = true;
            gv.ExportSettings.ExportOnlyData = true;
            gv.ExportSettings.FileName = "ControleContabil";
            gv.ExportSettings.IgnorePaging = true;
            gv.MasterTableView.AllowPaging = false;              
 
            return gv;
        }
 
        protected void btnExportExcel_Click(object sender, ImageClickEventArgs e)
        {
            RadGrid gv = PrepareGridToExport();
 
            if (gv != null)
            {
                gv.ExportSettings.Excel.Format = GridExcelExportFormat.Biff;
                gv.MasterTableView.ExportToExcel();
            }
        }
 
        protected void btnExportPdf_Click(object sender, ImageClickEventArgs e)
        {
            RadGrid gv = PrepareGridToExport();
            if (gv != null)
            {        
                gv.ExportSettings.Pdf.FontType = Telerik.Web.Apoc.Render.Pdf.FontType.Subset;
                gv.ExportSettings.Pdf.PaperSize = GridPaperSize.Letter;
                gv.ExportSettings.Pdf.PageHeight = Unit.Parse("210mm");
                gv.ExportSettings.Pdf.PageWidth = Unit.Parse("397mm");
                gv.ExportSettings.Pdf.Title = "DashBoard";
                
                gv.MasterTableView.ExportToPdf();
            }
        }
 
        protected void btnExportWord_Click(object sender, ImageClickEventArgs e)
        {
            RadGrid gv = PrepareGridToExport();
             
            if (gv != null)
                gv.MasterTableView.ExportToWord();
        }
 
        protected void btnExportCsv_Click(object sender, ImageClickEventArgs e)
        {
            RadGrid gv = PrepareGridToExport();
             
            if (gv != null)
                gv.MasterTableView.ExportToCSV();
        }
 
        protected void radGrdContabil_PageIndexChanged(object sender, GridPageChangedEventArgs e)
        {
            radGrdContabil.CurrentPageIndex = e.NewPageIndex;
            FillGrid(true);
        }
 
        protected void radGrdContabil_SortCommand(object sender, GridSortCommandEventArgs e)
        {
            //radGrdContabil.MasterTableView.SortExpressions.Add(e.NewSortOrder);
            FillGrid(true);
        }
 
        protected void radGrdContabil_PageSizeChanged(object sender, GridPageSizeChangedEventArgs e)
        {
            //radGrdContabil.PageSize = e.NewPageSize;
            FillGrid(true);
        }
 
        protected void btnMenu_Click(object sender, EventArgs e)
        {
            Response.AuthRedirect("Menu.aspx", this.UsuarioLogado.UserName);
        }
    }
}

3 Answers, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 02 Dec 2013, 11:18 AM
Hello Daniel,

Please note that using DataBind() is not recommended. Performing complex grid operations such as Inserting, Deleting, Updating, Hierarchy relations, Grouping, Paging, Sorting, Filtering, etc. require accommodating appropriate database operations.  Therefore, we suggest you to avoid Simple Databinding and strongly recommend the use of more advanced databinding methods, which automatically handle the aforementioned functions:
Declarative DataSource
Advanced Data Binding

Hope this helps.

Regards,
Eyup
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Daniel
Top achievements
Rank 1
answered on 02 Dec 2013, 02:20 PM
Hey Eyup thanks for the reply!

But as I mentioned above, I don't even use any of these operations to make this error occurr, I simply use the form to filter and change all the data in the grid, and then becomes available all this operations!

Anyhow, Declarative Datasource is not an option since my querie is variable, and it is defined as a f***ing script (to my horror), and Advanced Data Binding I don't have a means of knowing who fired the event, the grid or the form button, 'cause this query is long running and the user do not wants to wait, I've tried firing an Rebind on button click and getting the sender's name on NeedDataSource (through ((Control)sender).ClientID) but all I've got was radGrid, so I can't show data properly!

Any other ideias???
Thanks
0
Eyup
Telerik team
answered on 05 Dec 2013, 09:12 AM
Hi Daniel,

In case you want to configure the grid structure dynamically, you can refer to the following topic:
http://www.telerik.com/help/aspnet-ajax/grid-changing-structure-dynamically.html

Please follow the described steps and let us know about the result.

Regards,
Eyup
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
Grid
Asked by
Daniel
Top achievements
Rank 1
Answers by
Eyup
Telerik team
Daniel
Top achievements
Rank 1
Share this question
or