Kendo UI ASP.Net MVC 实现多图片及时显示加上传(其中有借鉴别人的代码,自己又精简了一下,如有冒犯,请多原谅!)
View:
<div class="demo-section k-content">
@(Html.Kendo().Upload()
.Name("files") //这个是kendoUI上传控件的ID也是name
.Async(a => a
.Save("Savesd", "Admins") // 这个是kendoUI保存动作 (左边是动作右边是控制器)
.Remove("Remove", "Upload") // 删除
.AutoUpload(false) //这个是是否自动上传
)
.Events(es=>es.Select("onSelect")) //这个是上传控件的一个事件 当选择完图片时执行里边的一个JS 方法
)
<div id="show"> // 这个是存放显示图片的DIV
</div>
</div>
<script type="text/javascript">
function onSelect(e) {
var id = document.getElementById("show"); // 找见show这个div
var fileid = document.getElementById("files").files[0]; // 获取 名为 files 选择的文件的路径
var img = document.createElement("img"); // 创建一个图片标记
img.height = 100; // 设置img 得高为100px
var read = new FileReader(); // 这个是及时显示的重要部分 FileReader 获取图片的base64代码并预览
read.addEventListener("load", function () { // 监听 FileReader 的 load 事件 把它获取到的src 赋给 img 让 img 显示
img.src = read.result;
});
read.readAsDataURL(fileid);
id.appendChild(img); // 把创建的 img标签 添加到 show 这个 div里
}
</script>
Controller
public ActionResult Savesd(IEnumerable<HttpPostedFileBase> files) // 这个里边的参数是 列表的 HttppostedFileBase 用于放前台传过来的 文件
{
if(files!=null)
{
foreach (var file in files) // 遍历这个 files 把每一项放到 file 里
{
var fileName = Path.GetFileName(file.FileName);
var physicalPath = Path.Combine(Server.MapPath("/Uploads"), fileName); // 把找见带Uploads 这个的 物理文件路径 和 上传的图片名 合二为一
file.SaveAs(physicalPath); // 保存
}
}
return Content("");
}
Kendo UI ASP.Net MVC 实现多图片及时显示加上传(其中有借鉴别人的代码,自己又精简了一下,如有冒犯,请多原谅!)的更多相关文章
- [转]ASP.net MVC 2 自定义模板来显示数据
本文转自:http://blog.163.com/liaojunbo@126/blog/static/1394892972012113104653651/ 在ASP.net MVC 2中,一个很有意思 ...
- Asp.Net MVC 文件管理Demo(文件展示,上传,下载,压缩,文件重命名等)
之前 ,有想做一个文件管理页面. 参考了 许多资料,终于完成了一个基于Asp.net MVC 的文件管理Demo.界面如下. 一,实现功能及相关技术 文件管理Demo基于Asp.NET MVC , ...
- ASP.NET MVC中jQuery与angularjs混合应用传参并绑定数据
要求是这样子的,在一个列表页中,用户点击详细铵钮,带记录的主键值至另一页.在另一外页中,获取记录数据,然后显示此记录数据在网页上. 先用动图演示: 昨天有分享为ng-click传递参数 <ang ...
- ASP.NET MVC在服务端把异步上传的图片裁剪成不同尺寸分别保存,并设置上传目录的尺寸限制
我曾经试过使用JSAjaxFileUploader插件来把文件.照片以异步的方式上传,就像"MVC文件图片ajax上传轻量级解决方案,使用客户端JSAjaxFileUploader插件01- ...
- ASP.NET MVC实现剪切图片
开发需要,我们需要对某一张图片进行剪切.就是说,获取图片某一区域.下面Insus.NET教大家轻便容易实现它. 首先写好一个处理函数,它建在MVC应用程序结构Utilities目录下: 准备好一张图片 ...
- 【ARK UI】HarmonyOS 从相册选择图片并显示到Image组件上
参考资料 [Harmony OS][ARK UI]ETS 上下文基本操作 [Harmony OS][ARK UI]ets使用startAbility或startAbilityForResult方式 ...
- 在Asp.Net MVC中实现上传图片并显示
实现思路大概分为两步: 1. 通过上传接口,将图片上传到服务器,返回文件路径给客户端: 2. 点击保存上传,将文件路径保存到数据库,如果是多张图片,路径用逗号分隔. 核心上传代码: /// <s ...
- ASP.NET MVC之Html.RenderAction(无操作方法 传参数)
WEB窗体模式开发惯了,切入MVC模式,好多东西都不懂,每一步都要查资料. 初步得来的一些知识点体会是: _Layout.cshtml就相当于母版页 然后partical视图(部分视图)就是用户控件. ...
- [Asp.net mvc]jquery.form.js无刷新上传
写在前面 最近在自己的网盘项目中想用ajax.beginform的方式做无刷新的操作,提交表单什么的都可以,但针对文件上传,就是个鸡肋.在网上查找了发现很多人都遇到了这个问题,大部分都推荐使用jque ...
随机推荐
- [POJ 3581]Sequence
[POJ 3581]Sequence 标签: 后缀数组 题目链接 题意 给你一串序列\(A_i\),保证对于$ \forall i \in [2,n],都有A_1 >A_i$. 现在需要把这个序 ...
- ORACLE数据库SQL优化 not in 与not exits
各个表的数据量: sys_file_convert_queue 65989sys_att_file 73061sys_att_main 84405sys_att_rtf_data 1507 优化前,执 ...
- java线程优先级
java的线程优先级分为1-10 这10个等级 1为最强,最优先 10为最弱 如果大于10或者小于1则会抛异常 源代码为: public final void setPriority(int newP ...
- java字符串以及字符类型基础
介绍一下java字符集和字符的编码方式, 首先要区分一下字符集和字符编码.所谓的字符集 类似于unicode,GB2312,GBK,ASCII等等.因为一开始只有26个英文字母需要 编一下号.所有用下 ...
- POJ - 3268 单源最短路
题意:给定一些有向边,以及一个目的地,从某个点到达目的地,再从目的地回到那个点.共有n个点,问这n个点花费最大是多少? 思路:从目的地回去直接把目的地作为源点即可.那么从某个点到达目的地应该如何得到最 ...
- NOIP2017记
Day-1~Day0 帮忙布置考场,打印座位表耗掉了不少XFZ的白纸(被瞪了一眼),围着三四楼跑了不知道多少圈贴座位表,跑到绝望...... 然后试了一下机,性能还可以,但是大佬用的机的cpu都不是很 ...
- Console 口配置 Telnet 登录方式典型配置指导
1.进入系统视图,启动 Telnet 服务 system-view [Sysname] telnet server enable 2.配置从 VTY 用户界面登录后可以访问的命令级别为 2 级 [Sy ...
- 转载 git Unknown SSL protocol error in connection to github.com:443
1.执行命令:git pull –progress –no-rebase -v "origin",报错,如图1 fatal: unable to access 'https://g ...
- Lua Table转C# Dictionary
因为在游戏公司做web后台开发,经常会涉及到取游戏服务器的数据库里面读写各种操作. 昨天下午,服务器那边让我读一个配置显示到后台,让运营大佬们可以在web后台配置游戏参数. 本来以为很简单个事情,结果 ...
- Davinci DM6446开发攻略——DSP开发工程建立
前段时间一直忙一个项目,同时在生活上时时提防和抵抗中国地沟油.国外核心转基因调和油.大豆油.色拉油.大米玉米.可怕的喂药鱼.药水泡农药喷无虫咬的青菜,所以没时间打理自己的博客,让开发攻略停顿了一段时间 ...