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

news/2024/7/21 6:07:47 标签: easyui, EXCEL, C#, asp.net, easyui-filebox

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


http://www.niftyadmin.cn/n/837092.html

相关文章

电商订单 + 物流信息对称补齐案例 - A, B表,到达时间交叉,增量JOIN补全C数据...

标签 PostgreSQL , 到达时间不确定 , 补齐 , JOIN 背景 在电商平台中&#xff0c;分销是非常普遍的现象&#xff0c;你在淘宝上买的东西&#xff0c;很可能并不是商家本身发货的&#xff0c;和你对接的商家&#xff0c;也许只是一个分销商。 因此一个物流信息&#xff0c;可能涉…

3-SII--Android的SD卡文件读写

零、前言 [1]读写SD卡需要运行时权限。 [2]如果对运行时权限不清楚的童鞋&#xff0c;可以看一下我的封装&#xff1a;TI--安卓运行时权限完美封装 一、使用&#xff1a;SD卡文件读写 FileHelper fileHelper FileHelper.get(); //在SD卡追加模式创建&#xff1a;data/writeFil…

java逻辑错误_Java语言中两种异常的差别

Java提供了两类主要的异常:runtime exception和checked exception。所有的checked exception是从java.lang.Exception类衍生出来的&#xff0c;而runtime exception则是从java.lang.RuntimeException或java.lang.Error类衍生出来的。它们的不同之处表现在两方面:机制上和逻辑上…

纯javascript验证码

<html> <head> <title>纯字验证码</title> <meta http-equivcontent-type contenttext/html;charsetutf-8/> <script src"http://code.jquery.com/jquery-latest.js"></script><script typetext/javascript>…

LDAP Filter用法

#根据Pager过滤域用户 $pagers gc D:\Operations\tmp\u.txt foreach ($p in $pagers) { $user Get-ADUser -Filter "pager -eq $($p)" -Properties pager -searchbase ",ouyy,dcux,dcyy,dccom" if ($user -ne $null) {$user.pager "," $use…

局部变量java6_JAVA局部变量 - 二九结狐六体的个人空间 - OSCHINA - 中文开源技术交流社区...

-局部变量声明在方法、构造方法或者语句块中&#xff1b;-局部变量在方法、构造方法、或者语句块被执行的时候创建&#xff0c;当它们执行完成后&#xff0c;变量将会被销毁&#xff1b;-访问修饰符不能用于局部变量&#xff1b;-局部变量只在声明它的方法、构造方法或者语句块…

软件开发阶段涉及到的自动化测试技术---打卡第五天

在前面的文章中&#xff0c;我介绍了为什么要做自动化测试&#xff0c;以及什么样的项目适合做自动化测试&#xff0c;那么现在我来说说软件开发生命周期的各个阶段都有哪些类型的自动化测试技术。 说到自动化测试&#xff0c;你可能最为熟悉的就是 GUI 自动化测试了。比如&…

javascript的checkbox和radio的选中控制和取值

获取radio的选中值&#xff08;单选&#xff09;: var ParentJob $("input[nameParentJob][typeradio]:checked").val();var Sex $("input[nameSex][checked]").val(); 获取checkbox的选中值&#xff08;多选&#xff09;: var id_array new Array()…