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

Opening Stand alone Image Manager

3 Answers 85 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Fit2Page
Top achievements
Rank 2
Iron
Iron
Veteran
Fit2Page asked on 09 Feb 2017, 09:53 AM

Hi,

If I follow these instructions: http://www.telerik.com/support/kb/aspnet-ajax/editor/details/using-the-image-and-document-managers-outside-radeditor

When I open like this everything is OK:

 

function OpenImgManager(TheBox) {
    $find(TheBox).open('ImageManager', { CssClasses: [] }, null, 'ImageManager');
}

 

But when I open like this, the image url is only passed when double clicking the image, on INSERT button null value is passed.

 

function OpenImgManager(TheBox) {
    var args = new Telerik.Web.UI.EditorCommandEventArgs("ImageManager", null, document.createElement("a"));
    args.CssClasses = [];
    $find(TheBox).open('ImageManager', args);
}

 

What is happening here, I think this always worked till now.

 

Marc

3 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 10 Feb 2017, 01:56 PM

Hi,

Here is the solution for v2017.1.118:

ASPX:

<script type="text/javascript"
    function ImageManagerFunction(sender, args) {
        if (!args) {
            alert('No file was selected!');
            return false;
        }
 
 
        var path = args.value[0].src;
        var txt = $get('<%= TextBox1.ClientID %>'); 
        txt.value = "<img src='" + path + "' />";
    }
  
 
function OpenImgManager()
{
    var args = new Telerik.Web.UI.EditorCommandEventArgs("ImageManager", null, document.createElement("img"));
    args.CssClasses = [];
     
    $find('<%= DialogOpener1.ClientID %>').open('ImageManager', args);
}
</script>
          
<asp:TextBox runat="server" ID="TextBox1" Width="400px"></asp:TextBox><br />
<telerik:dialogopener runat="server" id="DialogOpener1"></telerik:dialogopener>
<button onclick="OpenImgManager();return false;">Open ImageManager</button>

ASPX.CS

using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using Telerik.Web.UI;
using Telerik.Web.UI.Editor.DialogControls;
 
public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        FileManagerDialogParameters imageManagerParameters = new FileManagerDialogParameters(); 
        imageManagerParameters.ViewPaths = new string[] { "~/Images" };
        imageManagerParameters.UploadPaths = new string[] { "~/Images" };
        imageManagerParameters.DeletePaths = new string[] { "~/Images" };
        imageManagerParameters.MaxUploadFileSize = 5000000;
        // If you don't set the following property, the default value will be used 
        // imageManagerParameters.SearchPatterns = new string[] { "*.jpg" }; 
 
        DialogDefinition imageManager = new DialogDefinition(typeof(ImageManagerDialog), imageManagerParameters);
        imageManager.ClientCallbackFunction = "ImageManagerFunction";
        imageManager.Width = Unit.Pixel(694);
        imageManager.Height = Unit.Pixel(440);
        //If you need to customize the dialog then register the external dialog files
        //imageManager.Parameters["ExternalDialogsPath"] = "~/EditorDialogs/";
 
        DialogOpener1.DialogDefinitions.Add("ImageManager", imageManager);
       
    }
}

Regards,
Rumen
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Fit2Page
Top achievements
Rank 2
Iron
Iron
Veteran
answered on 13 Feb 2017, 09:18 AM

Isn't DialogOpener deprecated?

I always use RadDialogOpener, so now I get:

Telerik.Web.UI.RadUpload with ID='upload1' was unable to find an embedded skin with the name 'Material'. Please, make sure that the skin name is spelled correctly and that you have added a reference to the Telerik.Web.UI.Skins.dll assembly in your project. If you want to use a custom skin, set EnableEmbeddedSkins=false.

 

Marc

 

0
Rumen
Telerik team
answered on 13 Feb 2017, 01:06 PM

Hello Marc,

Actually, it's the RadUpload control which has been obsoleted and replaced by RadAsyncUpload since June 2013 (Q2’13).

The Material skin has been released in Q1 2016 and does not support either the old nor the Classic render mode.

What you can do is to enable RadAsyncUpload and the Lightweight rendering of the dialog by setting

FileManagerDialogParameters imageManagerParameters = new FileManagerDialogParameters();
imageManagerParameters.EnableAsyncUpload = true;
imageManagerParameters.RenderMode = RenderMode.Lightweight;

Best regards,
Rumen
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Editor
Asked by
Fit2Page
Top achievements
Rank 2
Iron
Iron
Veteran
Answers by
Rumen
Telerik team
Fit2Page
Top achievements
Rank 2
Iron
Iron
Veteran
Share this question
or