Switch ExplorerMode from toolbar

6 posts, 0 answers
  1. Martin Roussel
    Martin Roussel avatar
    246 posts
    Member since:
    Jan 2010

    Posted 14 Sep 2012 Link to this post

    Hi, ive added a custom button to my FileExplorer toolbar and want to make it a ExplorerMode switcher using Ajax refreshing. Im unable to make it work correctly but i think im very close. When I click the button, the ExplorerMode property changes (when looking in RadAjaxManager1_AjaxRequest) but nothing happens visually. Here's the code:

    <telerik:RadFileExplorer runat="server" ID="RadFileExplorer1" Skin="WebBlue" Width="99.7%" Height="250px" AllowPaging="true" PageSize="50" ExplorerMode="Default" CssClass="rfeLargeThumbnails" EnableFilterTextBox="true" EnableFilteringOnEnterPressed="false" FilterTextBoxLabel="Filter By"  meta:resourcekey="labFilterBy" DisplayUpFolderItem="false"  OnClientFileOpen="OnClientFileOpen" OnClientLoad="attachHandlers">
        <Configuration EnableAsyncUpload="true" MaxUploadFileSize="10485760" />
    </telerik:RadFileExplorer>

    function toolbarClicked(toolbar, args) {
        var buttonValue = args.get_item().get_value();
     
        if (buttonValue == "ViewMode") {
            var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
            ajaxManager.ajaxRequest("RadFileExplorer1_ViewMode");
        }
     
    }
     
    function attachHandlers(explorer, args) {
       
        var toolbar = explorer.get_toolbar();
        toolbar.add_buttonClicked(toolbarClicked);
    }
     protected void Page_Load(object sender, EventArgs e)
            {

                if (!IsPostBack)
                {
      RadToolBarButton customButton =
    new RadToolBarButton("ViewMode");
     customButton.CssClass = "custom_button";
     customButton.Value = "ViewMode";
     customButton.Text = "View Mode";
     RadFileExplorer1.ToolBar.Items.Add(customButton);

         }
    }

    protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
           {
               if (e.Argument == "RadFileExplorer1_ViewMode")
               {
                   if (RadFileExplorer1.ExplorerMode == Telerik.Web.UI.FileExplorer.FileExplorerMode.Default)
                   {
                       RadFileExplorer1.ExplorerMode = Telerik.Web.UI.FileExplorer.FileExplorerMode.Thumbnails;
                   }
                   else
                   {
                       RadFileExplorer1.ExplorerMode = Telerik.Web.UI.FileExplorer.FileExplorerMode.Default;
                   }
     
               }
           }

    Can someone let me know what im doing wrong. It can become a nice feature to share to other members if this can work.

    TIA
  2. Vessy
    Admin
    Vessy avatar
    1382 posts

    Posted 17 Sep 2012 Link to this post

    Hi Martin,

    First, I just want to mention that the switch-between-the-modes functionality will be available in the next up-coming release which is planned for the middle of October.

    Nevertheless, if you still want to use your custom functionality until the time of the release, you will need to change the ViewMode in the PageLoad server event of the FileExplorer (because the RadAjaxManager1_AjaxRequest() method is called later and the changes cannot be applied):
    protected void Page_Load(object sender, EventArgs e)
    {
        //Remove the !Postback check in order to recreate the button after every click
        RadToolBarButton customButton = new RadToolBarButton("ViewMode");
        customButton.CssClass = "custom_button";
        customButton.Value = "ViewMode";
        customButton.Text = "View Mode";
        RadFileExplorer1.ToolBar.Items.Add(customButton);
     
        if (Request.Params.Get("__EVENTTARGET") == RadAjaxManager1.UniqueID && Request.Params.Get("__EVENTARGUMENT") == "RadFileExplorer1_ViewMode")
        {
            if (RadFileExplorer1.ExplorerMode == Telerik.Web.UI.FileExplorer.FileExplorerMode.Default)
            {
                RadFileExplorer1.ExplorerMode = Telerik.Web.UI.FileExplorer.FileExplorerMode.Thumbnails;
            }
            else
            {
                RadFileExplorer1.ExplorerMode = Telerik.Web.UI.FileExplorer.FileExplorerMode.Default;
            }
        }
    }

    Regards,
    Vesi
    the Telerik team
    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 their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Martin Roussel
    Martin Roussel avatar
    246 posts
    Member since:
    Jan 2010

    Posted 17 Sep 2012 Link to this post

    Vesi,

    thanks for the reply and the next release headsup. However, your solution gives me the same result than I had with my method. The ExplorerMode property is updated correctly but nothing happens visually (no Ajax refresh). Also when continuing browsing or clicking "Refresh" toolbar button, the mode stays the original one. Is there something else to add?

    Martin
  5. Vessy
    Admin
    Vessy avatar
    1382 posts

    Posted 17 Sep 2012 Link to this post

    Hi Martin,

    A possible reason for this behavior could be the  AjaxManager's configuration - in my test project I have set the RadAjaxManager1 as an AjaxControlID and the radFileExplorer1 as a ControlID:
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadFileExplorer1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>

    For your convenience I am attaching my test project. Could you, please, examine it and tell me if you are able to reproduce the same issue with it? For my test I have used the latest version of RadControls for ASP.NET AJAX (2012.2.912).

    Kind regards,
    Vesi
    the Telerik team
    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 their blog feed now.
  6. Martin Roussel
    Martin Roussel avatar
    246 posts
    Member since:
    Jan 2010

    Posted 17 Sep 2012 Link to this post

    Exactly what i was missing. Thank you alot!

    UPDATE: Ive found a problem once I use my new Explorer switcher: the control stay stuck on loading after clicking the Refresh toolbar button (when being in thumbnails mode). The weird thing is if the startup ExplorerMode (in markup) is "Thumbnails" the problems goes away.

    Can you test it out on your side please? For some reason, that im currently checking, my project wont accept your file.


    Martin
  7. Vessy
    Admin
    Vessy avatar
    1382 posts

    Posted 18 Sep 2012 Link to this post

    Hi Martin,

    This is a known bug, which has already been fixed internally and the fix would be available in the next up-coming release (2012 Q3).

    Unfortunately, for the time being, I am not able to provide you with a suitable workaround at this point.

    Greetings,
    Vesi
    the Telerik team
    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 their blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017