昨天初步将webuploader用在了项目中,但紧接着就发现了一个问题,每一个页面都需要写那么多初始化webUploader的代码,这样肯定是我不能接受的,于是花了半天时间对该控件进行了封装。

  最后,只需要引用这一个js文件即可。

  

<script src="~/webuploader/WebUploader_MVC.js"></script>

  然后在视图里面加上这几句,其中input是用来在编辑视图中使用,其中PhotoUrls是视图实体属性,用来保存修改后所有图片的urls。

      <div id="uploader" style="margin-left: 10px">
<div id="fileList"></div>
      <input type="hidden" id="PhotoUrls" name="PhotoUrls" value="" />
</div>

  再在js里面初始化即可:

    $("#uploader").CreateWebUpload({
auto: true,//即时自动上传
fileNumLimit: ,//限制上传图片数量
server: '/Helper/UpLoadProcess'//处理上传的服务端
});

  服务端的代码和之前的一样,没有什么改变。

  

var photoUrls = $("#uploader").GetFilesAddress();//该方法用来获取所有上传的图片URLS,不管是新增视图界面还是编辑视图界面。

【项目相关】MVC中将WebUploader进行封装的更多相关文章

  1. 9.2.2 .net framework下的MVC 控件的封装(下)

    控件封装的部分说明 可能有人觉得应该前后端分离,我也承认这是应该的方向,我们也在考虑使用ng2等简化前端.但是,我们封装控件还是因为如下原因综合考虑的: 我们这是个框架,上面支撑了许多个应用,包含几百 ...

  2. Idea 搭建Maven--web项目(MVC)

    小编最近正在学习使用MVC框架,在搭建Maven的项目过程中,遇到了很多问题,上网搜了很多材料才找到答案,为了小编以后查起来方便,也为了向广大小伙伴分享,写了这部片博文,敬我昨天一天的学习结果! 步骤 ...

  3. ASP.NET MVC中将数据从Controller传递到视图

    ASP.NET MVC中将数据从Controller传递到视图方法 1.ViewData ViewData的类型是字典数据,key-value 如:ViewData["Data"] ...

  4. vue项目搭建 (二) axios 封装篇

    vue项目搭建 (二) axios 封装篇 项目布局 vue-cli构建初始项目后,在src中进行增删修改 // 此处是模仿github上 bailicangdu 的 ├── src | ├── ap ...

  5. 根据funID,personID获取最新规划包项目相关信息

    1.定义:根据funID,personID获取最新规划包项目相关信息(code projecttype(阶段) Pname(code+name) projectID) 项目表tbl_cfg_Proje ...

  6. 用maven创建web项目(spring Mvc)

    用maven创建web项目(spring Mvc) 1.打开cmd进入到你要创建maven项目的目录下: 2.输入以下命令.然后根据提示输入相应的groupId.artifactId.version: ...

  7. 四、spring集成ibatis进行项目中dao层基类封装

    Apache iBatis(现已迁至Google Code下发展,更名为MyBatis)是当前IT项目中使用很广泛的一个半自动ORM框架,区别于Hibernate之类的全自动框架,iBatis对数据库 ...

  8. django_day10_项目相关

    django_day10_项目相关 展示数据的方法 数据对象obj 普通字段 obj.字段名 ====> 数据库该字段的值 带choices参数的 obj.字段名 ====> 数据库该字段 ...

  9. django_day11_项目相关

    django_day11_项目相关 新增和编辑 路由 url(r'^category_add/$', views.category_change, name='category_add'), url( ...

随机推荐

  1. ubuntu14.04 wifi频繁掉线解决

    uname -r sudo lspci -knn sudo lshw -numeric -class network sudo ifconfig -a sudo route -nv sudo rfki ...

  2. linux下批量修改文件名之rename

    最近因为突然用到需匹配更换文件名,发现rename命令真是 简单好用,和sed语法及vim 替换很相似. 1. 更改文件名后缀 rename 's/\.txt/\.html/' * 2.增加文件名后缀 ...

  3. sql server中的锁 事务锁 更新锁 保持锁 共享锁 你知道吗?

    锁定数据库的一个表 SELECT * FROM table WITH (HOLDLOCK) 注意: 锁定数据库的一个表的区别 SELECT * FROM table WITH (HOLDLOCK) 其 ...

  4. .NET 请求被挂起,前端轮询,委托

    起因:因项目需要监控方法中计算进度,故而想通过AJAX调用,返回前端显示进度,结果开发中遇到第二个AJAX请求被挂起,需要等到第一个请求(计算)完成后,才会被处理到. 百度种种,知其原因是在Sessi ...

  5. [FlashPlyaer] FP版本20.0.267对Win10的64位系统的不兼容问题

    Win10近日推送了一个新的升级补丁KB3132372,它专门用来修复Adobe Flash Player里的安全漏洞.但是很多用户反映升级了这个补丁之后导致浏览器上网时出现崩溃.卡死.空白等现象,尤 ...

  6. Heka–>Elasticsearch 索引数据过程的优化

    Heka 的参数配置跟Elasticsearch的参数没有关系,Heka只负责按照配置发送数据,所以索引的优化主要在 Elaticsearch端来完成. 下面是Elasticsearch的一些相关概念 ...

  7. Hdfs增量导入小文件合并的思路

    1.使用mr进行合并 2.使用getmerge 将文件拉取到本地,再上传到hdfs,注意nl参数 3.使用appendToFile 4.使用hadoop提供的打包压缩技术 Usage: hadoop ...

  8. 文件处理函数fopen、fread、fseek、fclose的使用实例介绍

    FILE文件流用于对文件的快速操作,主要的操作函数有fopen.fseek.fread.fclose,在对文件结构比较清楚时使用这几个函数会比较快捷的得到文件中具体位置的数据,提取对我们有用的信息,满 ...

  9. 嵌入式X86运行linux及QtEmbedded+触摸屏(X86PC104+Xlinux+QtE+触摸屏解决办法)

    嵌入式X86运行linux及QtEmbedded+触摸屏(X86PC104+Xlinux+QtE+触摸屏解决办法) QQ:5724308 邮箱:sankye@163.com

  10. QTEmbedded VCN实现

    1 在QT在第三方插件里加入VNC 进入\src\plugins\gfxdrivers\vnc,qmake -------make--------- make install 把目标文件夹gfxdri ...