Use Compact UI Mode

The following example demonstrates how to hide the selected files for upload from the user interface and render only the Select files button without additional UI elements in the Kendo UI Upload.

Example
  <style>
     #wrapper {
       display: inline-block;
     }

     .k-upload {
       border-width: 0;
     }

     .k-upload .k-dropzone {
       padding: 0;
     }

     .k-upload-status-total {
       display: none;
     }
   </style>

   <div id="wrapper">
           <input name="files" id="files" type="file" />
         </div>

     <script>
       $(document).ready(function() {
         $("#files").kendoUpload({
           async: {
             saveUrl: "save",
             removeUrl: "remove"
           },
           showFileList: false
         });

         //Removing the "Drop files here message"
         $("#files").closest(".k-upload").find(".k-dropzone em").remove();
       });
     </script>

See Also

For more runnable examples on the Kendo UI Upload widget, browse its How To documentation folder.

In this article
Not finding the help you need? Improve this article