delete the files using remove button from kendo ui fileupload plugin.

3 posts, 0 answers
  1. Sagar
    Sagar avatar
    1 posts
    Member since:
    Mar 2012

    Posted 08 Mar 2012 Link to this post

    HI Folks,

    I am new to kendo ui and i am using the file upload plugin in my mvc application.Everything works like a dream.But i have one additional requirement. When i am uploading the file i am assigning a unique image guid to the image file and uploading and then returning to the callback function.Here is my code.

    <script type="text/javascript">
        $(document).ready(function () {
                async: {
                    saveUrl: '@Url.Action("UploadBlogImages", "Blog")',
                    removeUrl: '@Url.Action("Remove", "Blog")',
                    autoUpload: true
                success: function (data) {
                    var imageGuids = data.response;
                    $.each(imageGuids, function (index, imageGuid) {
                        $('#form_uploadPic').append('<input type="hidden" value=' + imageGuid + 'name="ImgGuid">');
    I need to delete the file when the user clicks the remove button but my problem is,
    by default the remove button passes the name of the file(that was used at the time of upload)as the file name to delete.But I am
    renaming the file before uploading to server.I am assigning a unique guid to file.I have returned that guid to the success function.How do i configure so that the remove button passes that guid to server for deleting the file.


  2. André
    André avatar
    4 posts
    Member since:
    Feb 2012

    Posted 12 Mar 2012 Link to this post


    I am also interested in the solution of this problem.

    How can I pass my own query parameter for each deletable item in the upload list?
    I also cannot used the filename here.


  3. T. Tsonev
    T. Tsonev avatar
    2831 posts

    Posted 15 Mar 2012 Link to this post


    Please consider using the remove event:

    function onRemove(e) {
        var guids = [];

        for (var i = 0; i < e.files.length; i++) {
        } = { imageGuids: guids };

    You still need to maintain the association between file names and GUIDs somehow.

    I hope this helps.

    Kind regards,
    Tsvetomir Tsonev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top