Upload JSP Tag Overview
The Upload JSP tag is a server-side wrapper for the Kendo UI Upload widget.
The Upload is part of Telerik UI for JSP, a
professional grade UI library with 90+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.
Getting Started
Configuration
Below are listed the steps for you to follow when configuring an asynchronous upload using the Spring MVC framework.
Step 1 Make sure you followed all the steps from the introductory article on Telerik UI for JSP.
Step 2 Create a new action method which renders the view.
@RequestMapping(value = "/async", method = RequestMethod.GET)
public String index() {
return "web/upload/async";
}
Step 3 Add the Upload to the view.
<kendo:upload name="files">
<kendo:upload-async autoUpload="true" saveUrl="${saveUrl}" removeUrl="${removeUrl}"/>
</kendo:upload>
The name attribute is required and must be unique. It is used as a form field name in the requests to the server.
Step 4 Implement the Save controller action.
@RequestMapping(value = "/async/save", method = RequestMethod.POST)
public @ResponseBody String save(@RequestParam List<MultipartFile> files) {
// Save the files
// for (MultipartFile file : files) {
// }
// Return an empty string to signify success
return "";
}
Event Handling
Subscribe to Events
You can subscribe to all events exposed by Kendo UI Upload.
<kendo:upload name="files" upload="onUpload" success="onSuccess">
<kendo:upload-async autoUpload="true" saveUrl="${saveUrl}" removeUrl="${removeUrl}"/>
</kendo:upload>
<script>
function onUpload(e) {
// Handle the upload event
}
function onSuccess() {
// Handle the success event
}
</script>
Reference
Existing Instances
You are able to reference an existing Upload instance via the jQuery.data(). Once a reference is established, you are able to use the Upload API to control its behavior.
// Put this after your Kendo Upload for ASP.NET MVC declaration
<script>
$(function() {
// Notice that the Name() of the Upload is used to get its client-side instance
var upload = $("#attachments").data("kendoUpload");
});
</script>