Upload template link to files

2 posts, 1 answers
  1. Fred
    Fred avatar
    4 posts
    Member since:
    Jul 2012

    Posted 15 Jul 2015 Link to this post

    I would like to use a template for my upload widget that creates a link to the file so the user can preview them.  However I can't figure out how to pass the file path into the template.

     var draftFiles = [
    @foreach(var a in Model.InvoiceDraftCopies)
    @:{ name: "@(a.FileName)", extension: "@(a.FileExtension)", size: "@(a.FileSize)", path: "@(a.FilePath)" },

    template: kendo.template("<a href='#=path#' target='_blank'>#=name#</a><button type='button' class='k-upload-action'></button>")

    I added "path" to the initialfiles array, but can't get to it in the template.  I get an error on #=path#. ('path' is undefined).

  2. Answer
    Dimiter Madjarov
    Dimiter Madjarov avatar
    2207 posts

    Posted 17 Jul 2015 Link to this post

    Hello Fred,

    Indeed currently custom properties, except name, size and extension, cannot be accessed in the template. A workaround would be to iterate the upload files list on document.ready and manually insert the links.

    $(function () {
        var model = @Html.Raw(Json.Encode(Model.InvoiceDraftCopies));
        var upload = $("#upload").data("kendoUpload");
        var filenames = upload.wrapper.find(".k-filename");
        for (var i = 0; i < filenames.length; i++) {
            $(filenames[i]).html("<a href='" + model[i].FilePath+ "'>" + model[i].FileName + "</a>");

    I hope this information helps.

    Dimiter Madjarov
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top