Remove file from the upload list after its deleted

4 posts, 0 answers
  1. Bhushan
    Bhushan avatar
    2 posts
    Member since:
    Mar 2013

    Posted 25 Apr 2017 Link to this post

    Hi,

     

         I've a custom template to delete, download uploaded files. I would like to clear the deleted file from the upload control list after calling the 'deleteFiles' JS function in my code. Please do let me know how to achieve this. Thanks.

     

    Code snippet:

    <script id="fileTemplate" type="text/x-kendo-template">
        <span class='k-progress'></span>
        <div >
            <label class="control-label">Name: #=name#</label>
            <button type='button' class='btn btn-primary glyphicon glyphicon-remove pull-right' id="deleteFile" onclick="deleteFiles('#=name#', '#=files[0].extension#')"></button>
            <button type='button' class='btn btn-primary glyphicon glyphicon-download pull-right' id="downloadFile" onclick="downloadFiles('#=name#')"></button>
            @*<span class='file-icon #=addExtensionClass(files[0].extension)# pull-right'></span>*@
            @*<p class='file-heading file-size-heading'>Size: #=size# bytes</p>*@
        </div>
    </script>

  2. Ivan Danchev
    Admin
    Ivan Danchev avatar
    2058 posts

    Posted 26 Apr 2017 Link to this post

    Hello Bhushan,

    I replied in the support ticket you submitted with the same subject. To sum it up here, files can be removed from the Upload's file list with jQuery.
    <input type="button" value="Remove files" onclick="clearFiles()" />

    All files:
    function clearFiles() {
        $(".k-upload-files > li").remove();
    }

    A file specified by its position in the list:
    function clearFiles() {
        $(".k-upload-files > li:eq(1)").remove();
    }

    A file specified by its uid:
    function clearFiles() {
      var uid = "0892e402-c245-42bf-9e81-28414ae2a290";
       
      $(".k-upload-files").find("[data-uid='" + uid + "']").remove();
    }


    Regards,
    Ivan Danchev
    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.
  3. Bhushan
    Bhushan avatar
    2 posts
    Member since:
    Mar 2013

    Posted 26 Apr 2017 in reply to Ivan Danchev Link to this post

    Thanks for the solution Ivan! I will try this and let you know.
  4. Ivan Danchev
    Admin
    Ivan Danchev avatar
    2058 posts

    Posted 28 Apr 2017 Link to this post

    Hello Bhushan,

    Take your time. Feel free to get back to us if you have other questions on the Upload's functionality or its API.

    Regards,
    Ivan Danchev
    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.
Back to Top