下面这段代码主要有几个特点:

  1、Ajax提交表单

  2、表单中有一个<input type="file"/>

  3、当选择完图片后,利用AJAX提交表单,并在执行成功后返回图片路径,实现预览图片

<script type="text/javascript">

    $(document).ready(function () {
var form = $("#form1");
$("#file1").change(function () {
$("#form1").ajaxSubmit({
success: function (msg) { alert(msg); $("#img1").attr("src", msg); }
});
});
}); </script> <form id="form1" action="/Home/aa" method="post" enctype="multipart/form-data" >
<input type="file" name="file" onchange="up()" id="file1" />
<img alt="img" id="img1" />
</form>

控制器代码:

//这里只是为了实现效果,没有进行任何验证和处理
public ContentResult aa()
{
HttpPostedFileBase file = Request.Files["file"];
string path = "/Content/"+ System.IO.Path.GetFileName(file.FileName);
file.SaveAs(Path.Combine(Server.MapPath("~/Content"),Path.GetFileName(file.FileName)));
return Content(path);
}

代码狠简单,相信初学者很容易看懂。

【ASP.NET MVC】Ajax提交表单的更多相关文章

  1. MVC中ajax提交表单示例

    页面中: @using (Ajax.BeginForm("Login", "User", new AjaxOptions() { HttpMethod = &q ...

  2. Jquery ajax提交表单几种方法

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...

  3. Jquery ajax提交表单几种方法详解

    [导读] 在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的 ...

  4. MVC中提交表单的4种方式

    一,MVC  HtmlHelper方法 Html.BeginForm(actionName,controllerName,method,htmlAttributes){} BeginRouteForm ...

  5. Validator验证Ajax提交表单的方法

    Validator验证Ajax提交表单的方法 转自:http://hunanpengdake.iteye.com/blog/1671360 当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form ...

  6. lavarel框架中如何使用ajax提交表单

    开门见山,因为laravel以post形式提交数据时候需要加{{csrf_field()}}防止跨站攻击,所以当你用ajax提交表单时候自然也要加 在网上看了很多的解决方式,我是用下面这种方法解决的: ...

  7. ajax提交表单序列化(serialize())数据

    知识点: $("#form").serialize();将表单数据序列化为标准URL编码文本字符串(key1=value1&key2=value2…). 以下用一个例子来演 ...

  8. jquery实现ajax提交表单

    一般情况下,我们提交form表单采用的是submit的方法,典型的场景如下. <form id="thisForm" method="post" acti ...

  9. ajax提交表单、ajax实现文件上传

    ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...

随机推荐

  1. Nginx多个配置文件共用location配置

    一.应用情况 很多时候我们在一台服务器上部署了不止 一个项目,我们通过Nginx来代理,为了方便管理往往会将各个项目的配置分开写到不同的配置文件中,如: 在nginx.conf 文件中加上  incl ...

  2. linux shell学习二

    参考:http://www.cnblogs.com/waitig/p/5531463.html Shell注释 Shell中的注释以“#”号开头,所有以“#”号开头的代码都会被解释器所忽略. 比如下面 ...

  3. dhtmlx3.6 grid列头合并

    mygrid.setHeader("序号,操作人员,发药,#cspan,审核,#cspan,数量小计,金额小计");mygrid.attachHeader(["#rspa ...

  4. Codeforces Round #191 (Div. 2) B. Hungry Sequence(素数筛选法)

    . Hungry Sequence time limit per test 1 second memory limit per test 256 megabytes input standard in ...

  5. 爬取知乎话题async使用协程

    import requests import json import time from pyquery import PyQuery import pandas as pd from collect ...

  6. Centos7系统环境下Solr之Java实战(一)搭建solr服务器

    搭建步骤 1.分别上传tomcat.sorl到指定文件夹并解压 2.把solr部署到Tomcat下 通过命令 cp apache-tomcat-7.0.47 /usr/local/sorl/tomca ...

  7. 【BZOJ】1076 [SCOI2008]奖励关 期望DP+状压DP

    [题意]n种宝物,k关游戏,每关游戏给出一种宝物,可捡可不捡.每种宝物有一个价值(有负数).每个宝物有前提宝物列表,必须在前面的关卡取得列表宝物才能捡起这个宝物,求期望收益.k<=100,n&l ...

  8. 【CodeForces】679 B. Bear and Tower of Cubes

    [题目]B. Bear and Tower of Cubes [题意]有若干积木体积为1^3,2^3,...k^3,对于一个总体积X要求每次贪心地取<=X的最大积木拼上去(每个只能取一次)最后总 ...

  9. NYOJ 117 求逆序数 (树状数组)

    题目链接 描述 在一个排列中,如果一对数的前后位置与大小顺序相反,即前面的数大于后面的数,那么它们就称为一个逆序.一个排列中逆序的总数就称为这个排列的逆序数. 现在,给你一个N个元素的序列,请你判断出 ...

  10. 【Git】git clone与git pull区别

    从字面意思也可以理解,都是往下拉代码,git clone是克隆,git pull 是拉.但是,也有区别: 从远程服务器克隆一个一模一样的版本库到本地,复制的是整个版本库,叫做clone.(clone是 ...