kendoUpload

<style>
    .upfile { display: inline-block;  40%; }
.upfile li { display: inline-block;  auto; margin:0px; }
.upfile li input { 100%; }
.upfile li h4 { color: #999; font-weight: normal; margin:0px;}
</style>
<form action="javascript:void(0);" id="file_edit" >
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel"></h4>
    </div>
    <div class="modal-body">
        <div class="form-group">
            <label>上传文件:</label>
            <ul class="upfile k-block">
                <li>
                    <input type="file" id="fileAux" name="fileAux" data-fid="" />
                </li>
                <li>
                    <h4 id="fuAuxMsg"></h4>
                </li>
            </ul>
        </div>
    </div>
    <div class="alert alert-danger alert-dismissible fade in" role="alert" id="errMsg" style="display:none"></div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
    </div>
</form>

<script>
    $("#fileAux").kendoUpload({
        localization: {
            select: "选择文件",
            dropFilesHere: "",
            headerStatusUploaded: "",
            headerStatusUploading: "",
            statusUploading: "",
            uploadSelectedFiles: ""
        },
        multiple: false,
        showFileList: false,
        async: {
            saveUrl: "/FX/File/UpLoad",
            autoUpload: true
        },
        select: function (e) {
            var files = e.files;
        },
        upload: function (e) {
            $("#errMsg").hide();
            $("#fileAux").attr("data-fid", "");
            $("#fuAuxMsg").html("<img src='/content/image/loading_80×10.gif' />");
        },
        success: function (e) {
            if (e.response != null) {
                if (e.response.SUCCESS) {
                    $('#wndGeneralEdit').modal('toggle');
                    if ($("#grid_file").length > 0)
                        $("#grid_file").data("kendoGrid").dataSource.read();
                }
                else {
                    $("#fileAux").attr("data-fid", "");
                    $("#errMsg").html("<strong>上传失败:</strong>" + e.response.MESSAGE);
                    $("#errMsg").show({ duration: 200 });
                }
            }
            $(".k-upload-status-total").remove();
        },
        error: function (e) {
            console.log("Er", e);
        }
    });
</script>
原文地址:https://www.cnblogs.com/shiningrise/p/6557616.html