Grid refresh update issue after saving data from rad window form

8 posts, 0 answers
  1. Marc Arbesman
    Marc Arbesman avatar
    7 posts
    Member since:
    Feb 2006

    Posted 21 Oct 2009 Link to this post

    We have a radgrid which when adding or editing records, opens a separate form in a radwindow with it's own .aspx page.  We have run into an issue when attempting to add a new, or edit a record from a radwindow and upon clicking the save button in the window, we cannot get the corresponding radgrid to refresh the data properly.  The data saves properly in the database, the window closes, the ajax request method server side runs, and rebind method server side for the grid also runs when called from the ajax request method.

    This used to work on the older RadControls back before we upgraded the site to the ASP.NET AJAX RadControls.  The following sets of code are how we open the radwindow, save the data and close the radwindow, call the ajaxrequest method, and call the grid rebind method.

    We open the radwindow dynamically through the itemcommand event of the radgrid as such:
    Private Sub radgPayRequest_ItemCommand(ByVal source As ObjectByVal e As GridCommandEventArgs) Handles radgPayRequest.ItemCommand 
            If LCase(e.CommandName) = LCase("AddNewPaymentRequest"Then 
                'Set the cache values to pass to the window 
                Common.Cache.CacheSiteInfo.Cache_PageMode = EnumUI.PageMode.AddNew 
     
                'Open the radwindow 
                Call RadWindowSettings_AdminPilotPayRequest() 
    End If 
    End Sub 
     
    Private Sub RadWindowSettings_AdminPilotPayRequest() 
            Dim rwPilotPayRequest As New RadWindow 
     
            rwPilotPayRequest.InitialBehaviors = WindowBehaviors.None 
            rwPilotPayRequest.NavigateUrl = "Pilot/AdminPilotPayRequest.aspx" 
            rwPilotPayRequest.Height = System.Web.UI.WebControls.Unit.Pixel(500) 
            rwPilotPayRequest.Width = System.Web.UI.WebControls.Unit.Pixel(725) 
            rwPilotPayRequest.VisibleStatusbar = False 
            rwPilotPayRequest.Modal = False 
            rwPilotPayRequest.Behaviors = WindowBehaviors.Close 
            rwPilotPayRequest.DestroyOnClose = True 
            rwPilotPayRequest.VisibleOnPageLoad = True 
     
            radwWindowMan.Windows.Add(rwPilotPayRequest) 
        End Sub 

    This is the save button method from the window, which saves the new or existing record, and closes the window:
    Private Sub btnSave_Click(ByVal sender As System.ObjectByVal e As System.EventArgs) Handles btnSave.Click 
            Try 
                'We run the save event here, which saves the data correctly to the database 
     
                'Close the window 
                ClientScript.RegisterStartupScript(Page.GetType](), "CloseWindow""<script language=""javascript"">CloseRadWindow();</script>"
            End Try 
        End Sub 

    This is our javascript method, located in an external .js file which closes the radwindow:
    function GetRadWindow() 
        { 
            var oWindow = null
            if (window.radWindow) oWindow = window.radWindow; 
            else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow; 
            return oWindow; 
        } 
     
    function CloseRadWindow() 
        { 
            var oWindow = GetRadWindow(); 
     
            oWindow.Close(); 
        } 

    After the save button event runs from the aspx page in the radwindow, it accessed the refreshGrid() javascript method on the aspx page which contains the radgrid.  This is our code to get the id of the radajaxmanager to begin the Ajax Request:
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
    <script TYPE="text/javascript">              
                function refreshGrid(arg) 
                { 
                    if(!arg) 
                    { 
                        $find("<%=radaManager.ClientID %>").ajaxRequest("Rebind"); 
                    } 
                    else 
                    { 
                        $find("<%=radaManager.ClientID %>").ajaxRequest("RebindAndNavigate"); 
                    } 
                } 
            </script> 
        </telerik:RadCodeBlock> 

    The Ajax Manager we have on the same .aspx page as the radgrid has the following settings applied:
    <telerik:RadAjaxManager ID="radaManager" RUNAT="server" OnAjaxRequest="radaManager_AjaxRequest"
            <AjaxSettings> 
                <telerik:AjaxSetting AJAXCONTROLID="radaManager"
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl CONTROLID="radgPayRequest"></telerik:AjaxUpdatedControl> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
                <telerik:AjaxSetting AJAXCONTROLID="radgPayRequest"
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl CONTROLID="radgPayRequest"></telerik:AjaxUpdatedControl> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
            </AjaxSettings> 
        </telerik:RadAjaxManager> 

    The following code is the Ajax Request run server side:
    Protected Sub radaManager_AjaxRequest(ByVal sender As ObjectByVal e As AjaxRequestEventArgs) Handles radaManager.AjaxRequest 
            Select Case e.Argument 
                Case "Rebind" 
                    radgPayRequest.MasterTableView.SortExpressions.Clear() 
                    radgPayRequest.MasterTableView.GroupByExpressions.Clear() 
                    radgPayRequest.MasterTableView.Rebind() 
                Case "RebindAndNavigate" 
                    radgPayRequest.MasterTableView.SortExpressions.Clear() 
                    radgPayRequest.MasterTableView.GroupByExpressions.Clear() 
                    radgPayRequest.MasterTableView.Rebind() 
            End Select 
        End Sub 

    Then the rebind hits our NeedsDataSource Method and in theory should rebind the grid and refresh the data.  However, after we run this process the grid does not refresh the data, unless we hit the refresh command link in the command header we created on the grid.

    We have confirmed through testing that our Ajax Request event is being accessed and running the grid rebind method in the server side code.  We are not receiving any javascript errors either.

    On the older RadControls we had to force the postback on the page to get the AjaxManager to properly reload the grid data, which we found through the forums:
    Protected Overrides Sub RaisePostBackEvent(ByVal sourceControl As IPostBackEventHandler, ByVal eventArgument As String
            MyBase.RaisePostBackEvent(sourceControl, eventArgument) 
     
            If TypeOf sourceControl Is RadAjaxManager Then 
                Select Case eventArgument 
                    Case "Rebind" 
                        radgPayRequest.MasterTableView.SortExpressions.Clear() 
                        radgPayRequest.MasterTableView.GroupByExpressions.Clear() 
                        radgPayRequest.MasterTableView.Rebind() 
                    Case "RebindAndNavigate" 
                        radgPayRequest.MasterTableView.SortExpressions.Clear() 
                        radgPayRequest.MasterTableView.GroupByExpressions.Clear() 
                        radgPayRequest.MasterTableView.Rebind() 
                End Select 
            End If 
        End Sub 'RaisePostBackEvent 

    Has anyone run into this issue before with the ASP.NET AJAX controls?  If so, how were you able to get the grid to refresh the data?  Is it possible that the way we are opening the radwindow could cause the grid not to refresh?

    We appreciate any help or suggestions.
  2. Mira
    Admin
    Mira avatar
    1124 posts

    Posted 26 Oct 2009 Link to this post

    Hi Marc,

    I went through your code and I can confirm you have set up the ajax settings properly and handled the AjaxRequest as required. However, I can see that you have attached the AjaxRequest event of the manager twice, once in the aspx and once in code behind. Could you please remove the one handler and check it you have not handled other events thus? Please give it a try and let me know of the result.

    Kind regards,
    Mira
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Giovanni Pulvirenti
    Giovanni Pulvirenti avatar
    12 posts
    Member since:
    Nov 2009

    Posted 24 Mar 2010 Link to this post

    Hi Telerik,
    I'm resuming this old thread because I'm getting stuck on the same problem.
    The code and the scenario provided by Marc Arbesbam are absolutely the same of mine; and the problem too...
    Unfortunately this thread seam doesn't provide a definitive answer.
    The problem is that the grid doesn't refresh the data, but the database is updated and the "AjaxRequest" event of the code behind is fired. But, if I click on the button "search" (my scenario is a search engine), the new data are displayed.
    Usually, I think that quite everyone that posts in a support forum, writes also that the solution is "very very urgent".
    And this is also my case, after all :-) 
    In fact, for tomorrow is programmed the beta-version publication of my software.. so, every "urgent" answer will be very very appreciated.

    Thanks in advance,
    Giovanni

    P.S.: I'm developing with VS 2008 and I'm using the Q3 2009 SP2 release (RadAjaxManager v2009.3.1314.35).
    Should be involved the cassini vs web server cache management?
  5. Giovanni Pulvirenti
    Giovanni Pulvirenti avatar
    12 posts
    Member since:
    Nov 2009

    Posted 25 Mar 2010 Link to this post

    Reading again my preceding post, I've realized that I did not give you any piece of code to analyze. Sorry.
    I'll now try to describe as close as possible my own scenario.

    The AspX page is a vehicles search engine that presents the results inside a RadGrid.
    In the itemdatabound event of the grid, the reservation vehicle status is represented using two different images.
    When the user clicks on the vehicle free-status png, is opened a RadWindow that guides the user through the complex reservation process.
    My goal is - after the RadWindow close action - to achieve the ability to refresh the correspondent radgrid row.

    This is the code used inside the RadWindow (aspx file):
            <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
                <script type="text/javascript"
                    function GetRadWindow() { 
                        var oWindow = null
                        if (window.radWindow) oWindow = window.radWindow; 
                        else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow; 
                        return oWindow; 
                    } 
     
                    function CloseAndRebind() { 
                        var oWnd = GetRadWindow(); 
                        oWnd.close(); 
                        oWnd.BrowserWindow.refreshGrid(); 
                    } 
     
                </script> 
            </telerik:RadCodeBlock> 

    This is the code used inside the RadWindow (vb code behind):
        Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init 
     
            Me.bttCarReservable.Attributes("onclick") = "CloseAndRebind();" 
            Me.bttCarReserved.Attributes("onclick") = "CloseAndRebind();" 
     
        End Sub 
    When the page is initiating, it is attached the client side "onclick" event, so the "CloseAndRebind" javascript function can be recalled by the user action (doing or canceling reservation).
    As you can see, the CloseAndRebind function recalls another javascript function declared in the parent page where the grid resides.

    This javascript function is named "refreshGrid" and this is its code:
    function refreshGrid() { 
      $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest(); 
    As you can see, this very simple function finds the RadAjaxManager reference using its client id and then invokes the "ajaxRequest()" method.
    So, when this function is executed, it is invoked the server-side "AjaxRequest" event that is coded in the code behind as follows;
        Protected Sub RadAjaxManager1_AjaxRequest(ByVal sender As Object, ByVal e As Telerik.Web.UI.AjaxRequestEventArgs) Handles RadAjaxManager1.AjaxRequest 
             
            GridResults.Rebind() 
       
     
        End Sub 

    As you can see, it is invoked the server-side "Rebind" grid's function to trigger the "NeedDataSource" event.
    I'm sure that all the code is executed because the AjaxLoadingPanel starts to work and - most of all - the step-by-step server side debug process confirmed the correct execution.

    Sadly, the overall result it' frustrating: the grid does not refresh its content (images and text). If at this point I click on the button search (the datasource behind the grid is a database view), then the correct data are displayed.

    I hope that now there are more elements to work around.

    Thank you very much.
  6. Giovanni Pulvirenti
    Giovanni Pulvirenti avatar
    12 posts
    Member since:
    Nov 2009

    Posted 25 Mar 2010 Link to this post

    Well,
    finally I think I've fixed this issue :-)
    I'll explain that behavior for everyone who'll need it in the future.
    The problem is that the javascript attribute "onclick" of the buttons initialized in Page_Init is executed BEFORE the server-side code.
    So the database was updated AFTER the grid rebind via AjaxRequest method.

    Thanks anyway.
  7. Jonx
    Jonx avatar
    258 posts
    Member since:
    Jul 2012

    Posted 17 Dec 2010 Link to this post

    Hello Giovanni, you explain what the problem is not how to solve it ;)
    What have you changed to make it work?
    Thank you for your help...
    John.
  8. Giovanni Pulvirenti
    Giovanni Pulvirenti avatar
    12 posts
    Member since:
    Nov 2009

    Posted 17 Dec 2010 Link to this post

    Hi John,
    my post is quite one year old and it was not simple to find the code involved. Well, at the end I think I've found it :-)
    I've transformed the code since that post, so I hope it can helps you anyway.
    The scenario is this:
    1. DoubleClick on the selected row
    2. A window opens
    3. Do some work on it updating some data
    4. the grid row must reflect the changes

    On the aspx client code add this (the page name and its parameters obviously reflect my own code logic):
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">
        function RowDblClick(sender, eventArgs)
        {
            window.radopen("VehicleDetails.aspx?CID=" + eventArgs.getDataKeyValue("ConnID") + "&VID=" + eventArgs.getDataKeyValue("VehicleID"), "radwVehicleDetails");
        }
     
        function refreshGrid() {
             
            $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest();
            $find("<%= radgridVehicles.ClientID %>").get_masterTableView().rebind();
            $find("<%= radgridVehicles.ClientID %>").repaint();
        }
    </script>
    </telerik:RadCodeBlock>

    Then, add this:
    <telerik:RadWindowManager ID="RadWindowManager1" runat="server" Skin="Windows7" >
            <Windows>
                <telerik:RadWindow ID="radwVehicleDetails" runat="server" Modal="true" Title="Dettaglio Veicolo" OnClientClose="refreshGrid" />
            </Windows>
    </telerik:RadWindowManager>

    In the <ClientSettings> area of the RadGrid, add this (simply bind the DoubleClick event of the grid to the "RowDblClick" javascript function) :
    <ClientSettings>
        <Selecting AllowRowSelect="true" />
        <ClientEvents OnRowDblClick="RowDblClick" />
    </ClientSettings>

    Hope this helps.

    Giovanni
  9. Jonx
    Jonx avatar
    258 posts
    Member since:
    Jul 2012

    Posted 17 Dec 2010 Link to this post

    Hello Giovanni,
    Thanks a lot for your time... and for digging in your archives ;)

    The things that helped was to call the rebind by hand like you do:

    $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest();
    $find("<%= radgridVehicles.ClientID %>").get_masterTableView().rebind();
    $find("<%= radgridVehicles.ClientID %>").repaint();

    Thank you for the fast answer, you saved my day ;)

    John.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017