用easyui-filebox上传Excel文件(ASP.NET MVC)[附源码下载]

97 篇文章 1 订阅
44 篇文章 0 订阅

MVC的cshtml源码:

@{
    ViewBag.Title = "djk8888";
}
<link href="~/js/easyui/themes/default/easyui.css" rel="stylesheet" />
<link href="~/js/easyui/themes/icon.css" rel="stylesheet" />
<script src="~/js/easyui/jquery.min.js"></script>
<script src="~/js/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript">
    $(function () {
        //设置easyui-filebox
        $("#file1").filebox({
            //required: true,//是否必填
            //multiple: true,//是否多选(默认false,单选)
            //buttonAlign: 'left',//按钮出现的位置(默认right)
            width: '300px',//宽度
            prompt: '选择文件...',//提示信息
            buttonText: '选择',//按钮文字
            validType: ['fileSize[1024,"kb"]'],//文件大小限制(好像没卵用)
            accept: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel',//限制文件类型(也好像没卵用)
            onChange: function () {
                $("#btnUpload").hide();//隐藏上传按钮
                //判断选择的文件是不是Excel
                var temp = $("#file1").filebox('getValue');
                if (temp != '') {
                    var arr = temp.split('.');
                    if (arr.length > 1) {
                        var expanded_name = arr[arr.length - 1].toLowerCase();//取得文件扩展名
                        if (expanded_name == "xls" || expanded_name == "xlsx") {//确实是Excel文件
                            //判断文件大小
                            var f = document.getElementById("filebox_file_id_2").files;//用F12查看easyui生成的file控件的id
                            var size = f[0].size; //单位byte
                            var size = (size / 1024).toFixed(2);//单位kb
                            var maxFileSize = 1024;//1mb=1024kb
                            if (size > maxFileSize) {
                                $("#btnUpload").hide();//隐藏上传按钮
                                alert("文件大小:" + size + "KB,超过最大限制:" + maxFileSize + "KB");
                                $("#file1").filebox('reset');
                                return;
                            }
                            else {
                                $("#btnUpload").show();//显示上传按钮准备上传
                            }
                        }
                        else {//选择了其他类型的文件
                            $("#btnUpload").hide();//隐藏上传按钮
                            alert("请选择Excel文件!");
                            $("#file1").filebox('reset');
                            return;
                        }
                    }
                    else {//选择了无扩展名的文件
                        $("#btnUpload").hide();
                        alert("请选择Excel文件!!");
                        $("#file1").filebox('reset');
                        return;
                    }
                }
            },
        });
        //上传文件到服务器:
        $("#btnUpload").click(function () {
            $('#fm').form('submit', {
                url: '/Easyui/UploadExcel',
                success: function (result) {
                    alert(result);
                    $("#file1").filebox('reset');
                    $("#btnUpload").hide();//隐藏上传按钮
                }
            });
        });
    });
</script>
<h2>用easyui-filebox上传Excel文件(ASP.NET MVC)</h2>
<form id="fm" method="post" enctype="multipart/form-data">
    <input id="file1" class="easyui-filebox" name="file1" />
    <input type="button" id="btnUpload" value="上传" style="display:none;" />
</form>
MVC的Controller源码:

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace jqueryfileupload.Views.Home
{
    public class EasyuiController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }
        private string StorageRoot
        {
            get { return Path.Combine(Server.MapPath("~/Files")); }
        }
        public ActionResult UploadExcel()
        {
            try
            {
                var file = Request.Files["file1"];//file1就是easyui-filebox的name
                var fullPath = Path.Combine(StorageRoot, Path.GetFileName(file.FileName));
                file.SaveAs(fullPath);
                return Content("上传成功!");
            }
            catch (Exception ex)
            {
                return Content(ex.ToString()+"\r\n"+ex.Message+"\r\n"+ex.Source+"\r\n"+ex.StackTrace);
            }
        }
    }
}

本例配套源码下载: http://download.csdn.net/download/djk8888/10167119


用jQuery-File-Upload上传Excel文件(ASP.NET MVC) 传送门:http://blog.csdn.net/djk8888/article/details/78835131

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值