昨天初步将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. 将多个网页制作成一个CHM文件

    有时我们想将一个网站上的多个页面集中保存起来,在即使没有网络的情况下也能够查看. 这时可以将这些网页保存成.mht的单个文件(在IE中打开时,点击 文件 -> 另存) 再使用Easy CHM去将 ...

  2. arm-linux-gcc 常用参数讲解 gcc编译器使用方法

    我们需要编译出运行在ARM平台上的代码,所使用的交叉编译器为 arm-linux-gcc.下面将arm-linux-gcc编译工具的一些常用命令参数介绍给大家.在此之前首先介绍下编译器的工作过程,在使 ...

  3. dedecms列表页如何让文章列表里面的文章每隔五篇就隔开一段空间

    dedecms列表页如何让文章列表里面的文章每隔五篇就隔开一段空间,运用js控制列表样式的方法. 代码如下: <script type="text/javascript"&g ...

  4. [ActionScript 3.0] AS3 判断字符串是否为数字

    trace(isNaN(Number("0")));//false trace(isNaN(Number("123")));//false trace(isNa ...

  5. Export excel file using web API

    使用MVC controller输出excel的例子,自不待言,例子满天飞. 由于本项目使用的是Asp.net MVC API,因此在本项目使用API,实现了文件下载功能.代码的原理很简单,基本上是老 ...

  6. Enterprise Library 5.0 系列教程

    1. Microsoft Enterprise Library 5.0 系列教程(一) Caching Application Block (初级) 2. Microsoft Enterprise L ...

  7. 【转】nginx服务器安装及配置文件详解

    原文:http://seanlook.com/2015/05/17/nginx-install-and-config/ nginx服务器安装及配置文件详解 nginx在工作中已经有好几个环境在使用了, ...

  8. (转)直接拿来用!最火的iOS开源项目(一)

    1. AFNetworking 在众多iOS开源项目中,AFNetworking可以称得上是最受开发者欢迎的库项目.AFNetworking是一个轻量级的iOS.Mac OS X网络通信类库,现在是G ...

  9. Kendo UI - Observable

    在 Kendo 中,基类 Class 第一个重要的派生类就是 Observable, 顾名思义,就是一个可观察的对象,也就是观察者模式的基础. 对于观察者模式来说,应该有主题和观察者,这里我们讨论的其 ...

  10. python学习笔记(MD5算法)

    博主最近进度停滞了 对web开发理解欠缺好多内容 今天整理下MD5算法,这个涉及到mysql数据库存储用户表密码字段的时候 一般是带有加密的 # -*- coding: utf-8 -*- impor ...