Updating interface after upload

[Jostein]

In my project, I use a popup to upload files. Because i have to do some codebehind calculations to see if the popup should be shown, I have to run the window like this:

 

 

 

 

 

Dim sScript As String = "radopen('FileUpload.aspx?CusID=" & lID & "', 'InfoPopup');"
ScriptManager.RegisterStartupScript(Me, Me.[GetType](), "FileUpload", sScript, True)

In the FileUpload.aspx, the user can upload files. When he does, my DB is updated with the uploaded files.
In the original page, i have a RadTreeView with all existing files in a hierarchy. This treeview is updated through codebehind, and does not have any datasource. After the fileupload window is closed, I need to refresh this list, but as far as I can tell, there is no event that is fired when the window is closed. And in the codebehind of FileUpload.aspx, i cannot make a call to update the list in the original page. How can I get my list to refresh after the upload?

[Kevin]

Hello Jostein,

You would need to handle the OnClientClose event of the RadWindow and then initiate and ajax request or callback to update your RadTreeView.

Here's an example using the RadAjaxManager approach:

Page Markup:

<telerik:RadTreeView ID="RadTreeView" runat="server">
</telerik:RadTreeView>
<telerik:RadWindow ID="RadWindow1" runat="server" OnClientClose="OnClientClose">
</telerik:RadWindow>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadTreeView1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">

        function OnClientClose(sender, args) {
            var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
            ajaxManager.ajaxRequest("UpdateRadTreeView");
        }
    </script>
</telerik:RadCodeBlock>

Code-Behind:

protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)
{
    if(e.Argument == "UpdateRadTreeView")
    {
        // call code to update RadTreeView
    }
}

I hope that helps.

[Jostein]

Thanks, this seems to work. However, it only works the first time, and i have to reload the page to get it to work again.
Reproduced this in a smaller environment:

My .aspx file:

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Master.Master" CodeBehind="RadTesting.aspx.vb" Inherits="ProScreen3.Publisher.RadTesting"%>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

</asp:Content>



<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

<script src="PlaylistRightClick.js" type="text/javascript"></script>

</telerik:RadScriptBlock>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Upload" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

function OnClientClose(sender, args) {

var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");

ajaxManager.ajaxRequest("UpdateRadTreeViewPlaylist");

}

</script>

</telerik:RadCodeBlock>

<telerik:RadWindowManager VisibleStatusbar="False" Width="500px" Height="450px"

ReloadOnShow="True" EnableShadow="True"

ID="RadWindowManagerFileUpload" runat="server" ShowContentDuringLoad="False"

Modal="True" Behaviors="Close, Move, Resize" DestroyOnClose="True"

Animation="None" KeepInScreenBounds="True" Skin="Simple">

<Windows>

<telerik:RadWindow runat="server" ID="Upload" Modal="true" Width="500px" Height="500px" OnClientClose="OnClientClose">

</telerik:RadWindow>

</Windows>

</telerik:RadWindowManager>


<telerik:RadSplitter ID="RS_Main" Runat="server" Orientation="Vertical"

Width="100%" Height="671px" BorderSize="0" HeightOffset="100">


<telerik:RadPane ID="RP_Playlist" Runat="server" BorderColor="#CECDCD"

BorderStyle="None" BorderWidth="0px" Height="70%" Width="200px"

Scrolling="None">

<asp:UpdatePanel ID="upPlaylist" runat="server">

<ContentTemplate>


<telerik:RadTreeView ID="RadTreeViewPlaylist" runat="server"

CssClass="content" EnableDragAndDrop="True"

EnableDragAndDropBetweenNodes="True" Font-Names="MyriadPro" Font-Size="14px"

ForeColor="#5B5B5C" LoadingMessage="Laster inn meny..."

Skin="Windows7" DataFieldID="Id" DataTextField="Name"

OnContextMenuItemClick="RadTreeViewPlaylist_ContextMenuItemClick"

OnClientContextMenuItemClicking="onClientContextMenuItemClicking"

OnClientContextMenuShowing="onClientContextMenuShowing" >

<ContextMenus>

<telerik:RadTreeViewContextMenu ID="RadTreeViewContextMenu1" runat="server" ExpandAnimation-Duration="150" CollapseAnimation-Duration="150" CollapseDelay="150" EnableShadows="True">

<Items>

<telerik:RadMenuItem runat="server" Text="Ny spilleliste" Value="NewPlaylist">

</telerik:RadMenuItem>

<telerik:RadMenuItem runat="server" Text="Last opp innhold" Value="UploadPlaylist">

</telerik:RadMenuItem>

<telerik:RadMenuItem runat="server" Text="Kopier" Value="CopyPlaylist">

</telerik:RadMenuItem>

<telerik:RadMenuItem runat="server" Text="Slett" Value="DeletePlaylist">

</telerik:RadMenuItem>

</Items>

</telerik:RadTreeViewContextMenu>

</ContextMenus>

</telerik:RadTreeView>

<br />

</ContentTemplate>

</asp:UpdatePanel>

</telerik:RadPane>
</telerik:RadSplitter>


</asp:Content>

My aspx.vb file:

Imports System
Imports System.Collections
Imports System.ComponentModel
Imports System.Data
Imports System.Drawing
Imports System.Web
Imports System.Web.SessionState
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Web.UI.HtmlControls
Imports System.Text.RegularExpressions
Imports Telerik.Web.UI

Public Class RadTesting
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

        If Not IsPostBack Then
            FillPlaylists()
        End If

    End Sub

    Private Sub FillPlaylists()

        Dim o As New RadTreeNode
        Dim o2 As New RadTreeNode
        Dim o3 As New RadTreeNode

        With o
            .HoveredImageUrl = "~/img/16x16/Playlist-icon.png"
            .ImageUrl = "~/img/16x16/Playlist-icon.png"
            .Text = "0"
            .Value = "0"
        End With

        With o2
            .HoveredImageUrl = "~/img/16x16/Playlist-icon.png"
            .ImageUrl = "~/img/16x16/Playlist-icon.png"
            .Text = "1"
            .Value = "1"
        End With

        With o3
            .HoveredImageUrl = "~/img/16x16/Playlist-icon.png"
            .ImageUrl = "~/img/16x16/Playlist-icon.png"
            .Text = "2"
            .Value = "2"
        End With

        o2.Nodes.Add(o3)

        o.Nodes.Add(o2)

        o2 = New RadTreeNode
        With o2
            .HoveredImageUrl = "~/img/16x16/Playlist-icon.png"
            .ImageUrl = "~/img/16x16/Playlist-icon.png"
            .Text = "x"
            .Value = "0#0"
        End With
        o3 = New RadTreeNode
        With o3
            .HoveredImageUrl = "~/img/16x16/Playlist-icon.png"
            .ImageUrl = "~/img/16x16/Playlist-icon.png"
            .Text = "4"
            .Value = "4"
        End With
        o2.Nodes.Add(o3)
        o3 = New RadTreeNode
        With o3
            .HoveredImageUrl = "~/img/16x16/Playlist-icon.png"
            .ImageUrl = "~/img/16x16/Playlist-icon.png"
            .Text = "5"
            .Value = "5"
        End With
        o2.Nodes.Add(o3)
        o.Nodes.Add(o2)

        RadTreeViewPlaylist.Nodes.Add(o)


    End Sub


    Protected Sub RadTreeViewPlaylist_ContextMenuItemClick(ByVal sender As Object, ByVal e As RadTreeViewContextMenuEventArgs)

        Dim clickedNode As RadTreeNode = e.Node
        Dim lID As Long = 0

        Select Case e.MenuItem.Value

            Case "UploadPlaylist"
                lID = 1
                'Dim sScript As String = "radopen('FileUpload.aspx?CusID=" & lID & "', 'InfoPopup');"
                Dim sScript As String = "window.radopen('FileUpload2.aspx?CusID=" & lID & "', 'Upload');"
                ScriptManager.RegisterStartupScript(Me, Me.[GetType](), "Upload", sScript, True)

        End Select
    End Sub

    Protected Sub RadAjaxManager1_AjaxRequest(ByVal sender As Object, ByVal e As Telerik.Web.UI.AjaxRequestEventArgs)
        ' call code to update RadTreeView
        If e.Argument = "UpdateRadTreeViewPlaylist" Then
            FillPlaylists()
        End If
    End Sub
End Class

My Master page:

<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="Master.Master.vb" Inherits="ProScreen3.Publisher.Master" %>

<!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>
<title>TestingRadControls</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
          <form id="form1" runat="server">
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

        </asp:ContentPlaceHolder>
        </form>

</body>
</html>

My upload page:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="FileUpload2.aspx.vb" Inherits="ProScreen3.Publisher.FileUpload2" %>

<!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>Last opp filer til arkiv</title>
</head>
<body>

    <form id="form1" runat="server">
    <div>

    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference Assembly="Telerik.Web.UI"
                Name="Telerik.Web.UI.Common.Core.js">
            </asp:ScriptReference>
            <asp:ScriptReference Assembly="Telerik.Web.UI"
                Name="Telerik.Web.UI.Common.jQuery.js">
            </asp:ScriptReference>
            <asp:ScriptReference Assembly="Telerik.Web.UI"
                Name="Telerik.Web.UI.Common.jQueryInclude.js">
            </asp:ScriptReference>
        </Scripts>
    </telerik:RadScriptManager>
        <strong>Last opp filer til Arkiv(swf, ppt, pptx, mov)</strong><br />
        <br />
        <asp:Label runat="server" ID="LabelUploadName" Text="Navn: "></asp:Label><br />
        <telerik:RadTextBox ID="FileUploadName" runat="server"
            Width="140px"></telerik:RadTextBox><br />
            <br />
    <telerik:RadUpload ID="RadUpload1" Runat="server" ReadOnlyFileInputs="True" Skin="Simple" MaxFileInputsCount="1" ControlObjectsVisibility="None">
        <Localization Clear="Tøm" Delete="Fjern" Remove="Fjern"
            Select="Velg" />
    </telerik:RadUpload>
                <br />
<div align="center"">
        <telerik:RadButton ID="RadButton1" runat="server" Text="     Last opp     " Skin="Simple">
        </telerik:RadButton>
</div>
<br />
<asp:Label ID="lblCusID" runat="server" Visible="false"></asp:Label>
<asp:Label ID="LabelStatus" runat="server"></asp:Label>
    </div>
</form>
</body>
</html>

The upload file does not have any vb code.

Running this will produce a page with a single treeview with a few nodes. If you right-click on the node called "x", and choose "Last opp innhold", you will get a popup window. Simply closing this window again will run the update, and you can see that it does because it adds all the nodes in the tree another time. If i know try once more, nothing happens after I close the popup. It should have added the nodes yet again.

[Jostein]

My collegue figured this out.

 

 

OnClientClose="OnClientClose"

 

This line needs to be on the

RadWindowManager

Not on the

RadWindow

So nevermind. :)