MCV 的几种表单提交方式

一,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")" 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)

{

 //逻辑

}

posted @ 2019-04-30 15:56  祁炳烨  阅读(174)  评论(0编辑  收藏  举报