MCV 的几种表单提交方式
一,MVC HtmlHelper方法
Html.BeginForm(actionName,controllerName,method,htmlAttributes){} 其中actionName 是操作方法名称,controllerName 是控制器的名称 method 是用于窗体的HTTP方法(get或者set)htmlAttributes 是一个对象,其中包含要为该元素设置的HTML特性
BeginRouteForm 方法 (HtmlHelper, String, Object, FormMethod) // RouteValues 一个包含路由参数的对象。通过检查对象的属性,利用返回检查参数。次对象通常是是使用对象初始值设定项语法创建的。
二,传统Form表单Aciton属性提交
三,Jquery+Ajax 提交表单
四,MVC Controller控制器和表单参数传递
解释
在Visual Basic 和C#中,可以对HtmlHelper 烈性的任何对象将此方法作为实例方法调用。在您使用实例语法调用此方法时 将忽略第一个参数
html.BeginForm 方法演示
<h1>在线申请</h1>
@using (Html.BeginForm("Apply", "Star", FormMethod.Post, new {@class="MyForm"}))
{
<div class="application_b_3">
<table width="820" border="0">
<tr>
<td width="80" height="50">达人类型</td>
<td width="730">
@Html.DropDownListFor(m => m.StarModel.TypeID, Model.DropList, new { id = "type", @class = "my-" })
</td>
</tr>
<tr>
<td height="50">首页达人照</td>
<td>
<div class="picture_an" id="UploadPhoto" style="width: 142px">
<a href="javascript:void(0);" class="btn_addPic"><span><em>+</em>上传照片</span>
<input tabindex="3" title="支持jpg、jpeg、gif、png格式,文件小于5M" size="3" name="pic" id="absFileInput" class="filePrew" type="file" />
</a>
</div>
</td>
</tr>
<tr>
<td height="50"></td>
<td>
@Html.HiddenFor(m => m.StarModel.UserGravatar, new { id = "SXtPhoto" })
<img src="" id="imgPhoto" height="176px" />
</td>
</tr>
<tr>
<td height="100">自荐理由</td>
<td>
@Html.TextAreaFor(m => m.StarModel.ApplyReason, new { id = "tDesc" })
</td>
</tr>
<tr>
<td height="50"></td>
<td>
<a href=" javascript:void(0)" id="btnApplication"><img src="@Url.Content("~/Areas/SNS/Themes/Default/Content/images/ap_9.gif")" alt="" /> </a>
</td>
</tr>
</table>
</div>
}
二、BeginRouteForm方法(HtmlHelper,String,Object,FormMethod)
参数解释
htmlHelp 类型 System.Web.Mvc.HtmlHelper 此方法扩展的HTML帮助程序实例
RouteName 类型System.String 用于获取窗体发布URL的路由名称。
RoutValues 类型System.Object 一个包含路由参数的对象。通过检查对象的属性,利用反射检索参数。次对象通常使用对象初始值设定语法创建的。
Method 类型 System.Web.Mvc.FormMethod 用于处理窗体的HTTP方法(Get或POST)
返回值 类型System.Web.Mvc.Html.MvcForm 一个开始<From>标记
BeginRouteForm展示
<div>
@using(html.BeginRouteForm("SearchPage",new{
cityID = Model.CityID, productType = Model.CurrentProductType, currentPageIndex = Model.CurrentIndex, keyword = Model.keyword }, FormMethod.Get)
}))
{
<input type="type" name="keyword" class="serch-ipt" value=@Model.keyword>
<input type="submie" id="submit" value="搜索" class="gsearch-btn">
</div>
}
传统Form表单Action属性提交
直接利用Html表单的Action属性进行提交
展示一下
<form id="askform" action="@url.Action("AskForm")" method="post">
<div class="title-area-outter clearfix"">
<span></span>
<select id="dplBDTType" name="dplDBTType"></select>
<select id="seleType" name="selType"></select>
<div>
</form>
Jquery+Ajax提交表单
方法展示
VIew部分
<div class="issue" id="postWeibo" style="width:80px">
<href="javascript:void(0)" class="publish-btn">发布</a>
</div>
jquery 和Ajax 部分
//发布微博
$("#postWeibo").click(function(){
var blogID=$("#hfID").val();
var title=$("title").val();
var imgurl=$("preciewImgHide").val();
var des=editor.getCotent();
if(title=="")
{
ShowFailTip("微博标题不能为空");
return;
}
if("title.length>=40")
{
ShowFailTip("微博标题不能超出40个字");
return;
}
if(isNaN(fee))
{
ShowFailTip("不能包含文本必须是值类型!");
return;
}
if(ContainsDisWord(title+des))
{
ShowFailTip("您输入的聂荣含有禁用词语,请重新输入");
return;
}
$.ajax({
url:"/fx"+$Maticsoft.BasePath+"Blog/AjaxUpdate",
type:"post",
async:false,
dataType:"html",
// timeout:10000,
data:{Title:title,CityId:city,Fee:fee,CetegoryId:category,Days:dats,Tag:tag,startDate:startdate,endDate:enddate,ImgUrl:imgurl,Des:des,BlogId:blogID},
success:function(resultData){
$(".dialogDiv").hide();
if(resultData=="NO")
{
ShowFaiTip("操作失败,请你重试!");
}
if(resultData=="AA")
{
$.jBox.tip("管理员不能操作","error");
}else{
var data=$(resultData);
}
}
})
})
MVC Controller控制器和表单参数传递
1、普通参数
HTML标签那么和参数名一样。
Public Actionresult AskForm(string txtTitle,string txtEditor,string dpLBDTType,string selType,string txtYZM)
{
}
2、实体传参
HTML标签name属性和Model属性保持一致
[httpPost]
public ActionTesult Apply(ViewModel.SNS.Star model)
{
//逻辑代码
}
3、表单集合传参
[httpPost]
public ActionTesult Apply(FormCollection Form)
{
//逻辑
}
MCV 的几种表单提交方式的更多相关文章
- get和post两种表单提交方式的区别
今天看到一篇博客谈论get和post区别,简单总结一下https://www.cnblogs.com/logsharing/p/8448446.html 要说两者的区别,接触过web开发的人基本上都能 ...
- html表单提交方式
xml 表单提交方式: * 使用submit提交 <form> 要提交的数据 <input type="submit" /'> </form> ...
- JavaWeb学习日记----表单提交方式
1.表单提交方式 (1) 使用input控件中的submit提交 代码如下: <!DOCTYPE html> <html lang="en"> <he ...
- form表单提交方式
form表单提交方式总结一下: 一.利用submit按钮实现提交,当点击submit按钮时,触发onclick事件,由JavaScript里函数判断输入内容是否为空,如果为空,返回false, 不提交 ...
- php开发面试题---2、php常用面试题二(表单提交方式中的get和post有什么区别)
php开发面试题---2.php常用面试题二(表单提交方式中的get和post有什么区别) 一.总结 一句话总结: 数据位置:get参数在url里面,post在主体里面 数据大小:get几kb,pos ...
- ANDROID使用MULTIPARTENTITYBUILDER实现类似FORM表单提交方式的文件上传
最近在做 Android 端文件上传,要求采用 form 表单的方式提交,项目使用的 afinal 框架有文件上传功能,但是始终无法与php写的服务端对接上,无法上传成功.读源码发现:afinal 使 ...
- jQuery最简单的表单提交方式
第一步:绑定事件 常用的与ajax相关的事件参考如下: 1.$(selector).click(function) 2.$(selector).change(function) 3.$(selecto ...
- 学习java前端 两种form表单提交方式
第一种:原生方式 注意点:button标签的style为submit <form action="/trans/doTrans.do" method="post&q ...
- jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法
原始form表单值获取方式(手动): $.ajax({ type: "POST", url: "ajax.php", data: "Name=摘取天上 ...
随机推荐
- 数据库迁移expdp impdp 与 OGg 搭建
1.long 字段的无法使用OGG 同步 2.clob字段的导入导出Bug , 生产使用network-link 导入导出太慢了,本地导入导出速度会快3到4倍 .但是测试环境的情况却相反 测试环境和生 ...
- AVplayer搭建ftp共享PC端
1.安装FTP服务 2.关闭防火墙 3.添加FTP站点 设置ip时,需要查询本机的ip 本机测试 4.iphone安装AVPlayer,并设置
- 【3dsMax安装失败,如何卸载、安装3dMax 2018?】
AUTODESK系列软件着实令人头疼,安装失败之后不能完全卸载!!!(比如maya,cad,3dsmax等).有时手动删除注册表重装之后还是会出现各种问题,每个版本的C++Runtime和.NET f ...
- vue-cli构建项目在index.html中使用静态文件
在vue-cli构建的项目中,且使用在移动端,我们希望每一个页面加载时都可以使用flexible.js来适配手机. 那么这个flexible.js被import到每一个组件中就不合适了. 好的方法是直 ...
- jQuery Validate验证框架详解(转)
jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script type=& ...
- 第一次尝试用Open Live Writer写日志
注册博客园很久了,一直没怎么用,今天登陆了一下,看到这个写日志工具,看着不错,试一下
- CheckBox全选、取消全选
关于CheckBox全选取消全选 //全选 $("#SysAllSelectedID").click(function () { $("[name=SysCheckbox ...
- C#用委托实现异步,异步与多线程的异同
异步与多线程的区别(转) 一.异步和多线程有什么区别?其实,异步是目的,而多线程是实现这个目的的方法.异步是说,A发起一个操作后(一般都是比较耗时的操作,如果不耗时的操作就没有必要异步了),可以继续自 ...
- ACM-树重心的性质及动态维护
本文转自http://fanhq666.blog.163.com/blog/static/81943426201172472943638/ 求树重心的方法:(NlogN) http://www.cnb ...
- intellijidea课程 intellijidea神器使用技巧1-5 idea界面介绍
菜单栏介绍: file:文件操作edit:文本操作view:视图操作navigate:跳转code:源码文件analyze:项目依赖关系分析refactor:代码重构快捷操作,如:抽取函数build: ...