Using Image Browser Without Editor

4 posts, 2 answers
  1. Jackie
    Jackie avatar
    17 posts
    Member since:
    Jun 2017

    Posted 23 Aug Link to this post

    Looking at this thread, it appears its possible to use the image browser without it being inside an editor. http://www.telerik.com/forums/why-not-make-image-browser-in-editor-as-separate-controle

    Can you provide me with the syntax to initialize an image browser on its own without an editor in MVC? I've tried the following, but get an error.

    1.@(Html.Kendo().ImageBrowser(
    2.      .Image("~/UploadedPhotos/{0}")
    3.      .Read("ImageBrowser_Read", "Home", new { storyID = "#=StoryID#" })
    4.      .Create("ImageBrowser_Create", "Home")
    5.      .Destroy("ImageBrowser_Destroy", "Home")
    6.      .Upload("ImageBrowser_Upload", "Home", new { storyID = "#=StoryID#" })
    7.      .Thumbnail("ImageBrowser_Thumbnail", "Home")
    8.))
  2. Answer
    Dimitar
    Admin
    Dimitar avatar
    225 posts

    Posted 25 Aug Link to this post

    Hello Jackie,

    I am attaching an ASP.NET MVC solution, where the Kendo UI ImageBrowser is implemented as a standalone widget with the minimum working configuration.

    The MVC wrappers of Kendo UI does not provide an HtmlHelper specifically for the ImageBrowser, so the widget has to be initialized with jQuery (as shown in the provided example above). You can find more information about the configuration options of the widget in the Editor API Reference.

    Regards,
    Dimitar
    Progress Telerik
    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.
  3. Jackie
    Jackie avatar
    17 posts
    Member since:
    Jun 2017

    Posted 28 Aug Link to this post

    Hi Dimitar,

    Thanks for your help.

    I have another question. Is it possible for me to pass data to uploadUrl? As you can see in my code, I am doing so for read. However if I use the same syntax to pass the same data uploadUrl I get an error. Is there something I am missing here?

    01.$("#imgBrowser").kendoImageBrowser({
    02.    transport: {
    03.        type: "imagebrowser-aspnetmvc",
    04.        read: {
    05.            url: "/Home/ImageBrowser_Read",
    06.            type: "POST",
    07.            data: {
    08.                storyID: @Html.Raw(Model.StoryDisplayID)
    09.            }
    10.        },
    11.        destroy: {
    12.            url: "/Home/ImageBrowser_Destroy",
    13.            type: "POST"
    14.        },
    15.        create: {
    16.            url: "/Home/ImageBrowser_Create",
    17.            type: "POST"
    18.        },
    19.        imageUrl: "@Url.Content("~/UploadedPhotos/{0}")",
    20.        thumbnailUrl: "/Home/ImageBrowser_Thumbnail",
    21.        uploadUrl: "/Home/ImageBrowser_Upload"
    22.    }
    23.});

     

    Thank you

  4. Answer
    Dimitar
    Admin
    Dimitar avatar
    225 posts

    Posted 29 Aug Link to this post

    Hello Jackie,

    The uploadUrl configuration option of the ImageBrowser accepts only string as a parameter and cannot be configured to pass additional data out of the box.

    I would suggest to vote for this similar feature request in the Kendo UI Feedback Portal or create a new one. Based on the demand for this feature, it can be considered for implementation in a future release of Kendo UI.

    Regards,
    Dimitar
    Progress Telerik
    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.
Back to Top