1. 程式人生 > >MCV 的幾種表單提交方式

MCV 的幾種表單提交方式

一個 func function rfi 演示 viewmodel clas err url

一,MVC HtmlHelper方法
  1. Html.BeginForm(actionName,controllerName,method,htmlAttributes){} 其中actionName 是操作方法名稱,controllerName 是控制器的名稱 method 是用於窗體的HTTP方法(get或者set)htmlAttributes 是一個對象,其中包含要為該元素設置的HTML特性
  2. 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")" /> </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" [email protected]>

<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 的幾種表單提交方式