【ASP.NET MVC】Ajax提交表单
下面这段代码主要有几个特点:
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提交表单的更多相关文章
- MVC中ajax提交表单示例
页面中: @using (Ajax.BeginForm("Login", "User", new AjaxOptions() { HttpMethod = &q ...
- Jquery ajax提交表单几种方法
在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...
- Jquery ajax提交表单几种方法详解
[导读] 在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的 ...
- MVC中提交表单的4种方式
一,MVC HtmlHelper方法 Html.BeginForm(actionName,controllerName,method,htmlAttributes){} BeginRouteForm ...
- Validator验证Ajax提交表单的方法
Validator验证Ajax提交表单的方法 转自:http://hunanpengdake.iteye.com/blog/1671360 当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form ...
- lavarel框架中如何使用ajax提交表单
开门见山,因为laravel以post形式提交数据时候需要加{{csrf_field()}}防止跨站攻击,所以当你用ajax提交表单时候自然也要加 在网上看了很多的解决方式,我是用下面这种方法解决的: ...
- ajax提交表单序列化(serialize())数据
知识点: $("#form").serialize();将表单数据序列化为标准URL编码文本字符串(key1=value1&key2=value2…). 以下用一个例子来演 ...
- jquery实现ajax提交表单
一般情况下,我们提交form表单采用的是submit的方法,典型的场景如下. <form id="thisForm" method="post" acti ...
- ajax提交表单、ajax实现文件上传
ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...
随机推荐
- 【转】虚拟机克隆之后,网卡名称从eth0变成eth1之后的解决办法
使用VMware安装了CentOS虚拟机,克隆之后使用service network restart指令来重新启动网络服务时,会看到有eth0网卡不存在的提示. 出现这种现象的原因是,很多Linu ...
- 协程-遇到I/O自动切换
参考博客:http://www.cnblogs.com/alex3714/articles/5248247.html 一.前言 Gevent 是一个第三方库,可以轻松通过gevent实现并发同步或异步 ...
- win32/linux 线程 log
原文 #include <stdio.h> #include <stdlib.h> #include <string.h> #ifdef WIN32 #includ ...
- WebAPI IE8、IE9 跨域问题
关于WebAPI跨域的问题,网上已经很多了,以下方案可以解决很多跨域问题,但是都不支持IE8.IE9浏览器,JSONP也只能支持Get请求 通过dll配置 Install-Package Micros ...
- selenium利用Excel进行参数化(简单示例)
上篇搭建好环境后,正真开始我的自动化之旅了.... 开始之前特别说明一下testNG的版本,不能直接使用Eclipse直接线上下载的版本,线上版本太高,不能兼容,运行程序会报以下错误,需要自行下载低一 ...
- 【转】 虚拟机Linux不能上网简单有效的解决办法(NAT模式下)
前提条件: a. 确保VMware Network Adapter for VMnet8 处于启用状态,这个是NAT网络模式要用的虚拟网卡.注意这个网卡的IP地址,不需要做手动设置 b. 确保 VMw ...
- wepy开发小程序 大坑....本地调试ok,小程序上传体验版 组件出现问题
如果你碰到的上述问题(本地调试ok,小程序上传体验版 各种莫名其妙的问题-卡死-组件属性失效-$apply()不起作用) 您需要关闭 微信开发者工具中: 1.微信开发者工具-->项目--> ...
- koa源码阅读[1]-koa与koa-compose
接上次挖的坑,对koa2.x相关的源码进行分析 第一篇.不得不说,koa是一个很轻量.很优雅的http框架,尤其是在2.x以后移除了co的引入,使其代码变得更为清晰. express和koa同为一批人 ...
- layui结合mybatis的pagehelper插件的分页通用的方法
总体思路: 1.前台查询的时候将当前页和页大小传到后台 2.后台将当前页,页大小以及数据与数据总数返回前台,前台显示完表格完数据之后显示分页插件. 前台页面: 准备查询条件的表单,与数据表格,分页di ...
- nginx之日志设置详解
nginx的日志设置 access_log access_log是服务器记录了哪些用户,哪些页面以及用户浏览器.ip和其他的访问信息:是一种非常详细的记录信息:如果我们不关心谁访问了我们,可以关闭: ...