Freemarker:
<script src="${base}/vender/bootstrap-fileinput-master/js/fileinput.js"></script>
<script src="${base}/vender/bootstrap-fileinput-master/js/fileinput_locale_zh.js"></script>
<div class="form-group">
<label class="col-sm-2 control-label">介绍图片 </label>
<div class="col-sm-7">
<input type="text" class="form-control"
data-ng-model="searchInfo.introductionPhoto" readonly>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label"> </label>
<div class="col-sm-7">
<div style="float: inline;">
<div style="float: left;">
<input id="fileupload" name="picture" type="file"
class="file-loading ">
</div>
<label class="control-label" style="padding-left: 10px;">{{originalfileName}}</label>
</div>
</div>
</div>
js:
var playbackId =$("#playbackId").val();
//TODO 文件上传(图片)
$("#fileupload").fileinput({
language : 'zh',
uploadUrl : "find/fileUpload",
uploadAsync : false,
showCaption: false,
showPreview : true,
showUpload : false,
showRemove : false,
allowedFileExtensions : [ 'png', 'jpg' ],
elErrorContainer : '#export_error'
}).on("filebatchselected", function(event, files) {
$("#fileupload").fileinput("upload");
}).on('filebatchuploadsuccess', function(event, data) {
if (data.response.status != 0) {
$scope.error="封面上传失败!";
return;
}
$scope.$apply(function() {
$scope.searchInfo.introductionPhoto= data.response.introductionPhoto;
});
});