The HTML markup for a wijUpload widget looks like this.
Drop down to view markup
Markup |
Copy Code
|
<div id="upload" style="width: 300px"></div> |
You can initialize the widget with the following jQuery script.
Drop down to view script
Script |
Copy Code
|
<script id="script1" type="text/javascript">
var supportXhr;
$(document).ready(function ($) {
var progressbar = $("#progressbar");
var upload = $("#upload").wijupload({
change: function (e, data) {
},
upload: function (e, data) {
},
totalUpload: function () {
progressbar.show();
},
complete: function (e, data) {
},
totalComplete: function (e, data) {
progressbar.fadeOut(1500, function () {
if (supportXhr) {
$("#progressbar").wijprogressbar("option", "value", 0);
}
});
if (data.e.currentTarget.status != 200) {
alert("Upload failed!");
}
},
totalProgress: function (e, data) {
if (supportXhr) {
$("#progressbar").wijprogressbar("option", "maxValue", data.total);
$("#progressbar").wijprogressbar("option", "value", data.loaded);
}
},
action: "http://localhost:2164/Main/Widgets/Wijmo-Complete/development-bundle/samples/upload/upload.ashx"
});
supportXhr = $("#upload").wijupload("supportXhr");
if (supportXhr) {
progressbar.wijprogressbar({ value: 0 });
} else {
progressbar.addClass("Loading");
}
progressbar.hide();
});
</script> |
The markup and script featured here results in the following live widget. Click the Upload Files button to open the dialog.
See Also
Reference