当前位置： 移动技术网 > IT编程>开发语言>.net > ASP.NET MVC3手把手教你构建Web

ASP.NET MVC3手把手教你构建Web

2017年12月12日  | 移动技术网IT编程  | 我要评论

沈灵敏直播间,野苹果园,呼和浩特中考网

开发工具：vs2010+mssql2005,需要使用mvc3.0

环境配置

第一步：到官方网站下载mvc3,提供了简体中文。先安装 aspnetmvc3toolsupdatesetup.exe，然后安装aspnetmvc3toolsupdatevs11setup.exe

第二步：新建数据库，创建测试表。然后往表里insert些测试数据

use [yancomdb] 
go 
/****** 对象: table [dbo].[newsentity] 脚本日期: 03/12/2012 22:03:59 ******/ 
set ansi_nulls on 
go 
set quoted_identifier on 
go 
create table [dbo].[newsentity]( 
 [nid] [int] identity(1,1) not null, 
 [title] [nvarchar](100) collate chinese_prc_ci_as not null, 
 [information] [text] collate chinese_prc_ci_as null, 
 [time] [datetime] not null constraint [df_newsentity_time] default (getdate()), 
 constraint [pk_newsentity] primary key clustered 
( 
 [nid] asc 
)with (pad_index = off, ignore_dup_key = off) on [primary] 
) on [primary] textimage_on [primary]

构建列表页面

第一步：打开vs,新建选择mvc3 web应用程序，输入项目名称以及目录

第二步：创建newsentity类，本文使用自己手写实体类(没有使用linqtosql,ef等orm)

[tableattribute("newsentity")]//这行很重要，因为mvc框架默认去db中找类名复数的表名 
 public class newsentity 
 { 
  [key]//设置主键 
  public int nid { get; set; } 
 
  [stringlength(100)]//设置验证信息 
  [required(errormessage="标题不能为空")] 
  [displayname("标题")] 
  public string title { get; set; } 
 
  [required(errormessage = "正文必须填写")] 
  [displayname("正文")] 
  public string information { get; set; } 
 
  public datetime time { get; set; } 
 }

第三步：配置数据库连接字符，注意此处的name对应下一步中创建的类名。

<connectionstrings> 
<add name="projectentity" connectionstring="data source=ip;initial catalog=yancomdb;persist security info=true;user id=;password=" 
providername="system.data.sqlclient" /> 
</connectionstrings>

第四步：创建projectentity类，需要继承dbcontext

public class projectentity : dbcontext 
 { 
  public dbset<newsentity> newsentity { get; set; } 
 }

第五步：新建controller,

projectentity pe = new projectentity(); 
  public actionresult news() 
  { 
   try 
   { 
    var list = pe.newsentity.tolist(); 
    return view(list); 
   } 
   catch (exception e) 
   { 
    throw e; 
   } 
  }

第六步：在news上右键，新建视图。勾选“创建强类型视图”，选择newsentity,支架模块选择list


添加后，cshtml代码如下：

@model ienumerable<taiqiu.models.newsentity> 
@{ 
 viewbag.title = "后台新闻管理列表"; 
 layout = "~/views/shared/_mlayout.cshtml"; 
} 
<h2> 
 新闻列表</h2> 
<p> 
 @html.actionlink("添加", "create") 
</p> 
<table> 
 <tr> 
  <th width="50px"> 
   id 
  </th> 
  <th width="300px"> 
   标题 
  </th> 
  <th width="150px"> 
   时间 
  </th> 
  <th> 
  </th> 
 </tr> 
 @foreach (var item in model) 
 { 
  <tr> 
   <td> 
    @html.displayfor(modelitem => item.nid) 
   </td> 
   <td> 
    @html.displayfor(modelitem => item.title) 
   </td> 
   <td> 
    @html.displayfor(modelitem => item.time) 
   </td> 
   <td> 
    @html.actionlink("编辑", "editnews", new { id = item.nid }) | 
    @html.actionlink("删除", "deletenews", new { id=item.nid }) 
   </td> 
  </tr> 
 } 
</table>

运行后效果图如下：


到此，第一个列表页面就完成了(未涉及分页，后续会更新)。关于添加，修改，删除也就很容易了。

添加controller代码：

[httppost] 
  [validateinput(false)] 
  public actionresult create(newsentity news) 
  { 
   if (modelstate.isvalid) 
   { 
    news.time = datetime.now; 
    pe.newsentity.add(news); 
    try 
    { 
     pe.savechanges(); 
     return redirecttoaction("news"); 
    } 
    catch (exception e) 
    { 
     throw e; 
    } 
 
   } 
   return view(); 
  }

添加页面：

@model taiqiu.models.newsentity 
@{ 
 viewbag.title = "添加新闻"; 
 layout = "~/views/shared/_mlayout.cshtml"; 
} 
<h2> 
 添加新闻</h2> 
<script src="@url.content("~/scripts/jquery.validate.min.js")" type="text/javascript"></script> 
<script src="@url.content("~/scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 
<script src="@url.content("~/scripts/kindeditor/kindeditor.js")" type="text/javascript"></script> 
<script src="@url.content("~/scripts/kindeditor/lang/zh_cn.js")" type="text/javascript"></script> 
<script type="text/javascript"> 
  var editor; 
  kindeditor.ready(function (k) { 
   editor = k.create('textarea[name="information"]', { 
    allowfilemanager: true 
   }); 
  }); 
</script> 
@using (html.beginform()) 
{ 
 @html.validationsummary(true) 
 <fieldset> 
  <legend>news</legend> 
  <div class="editor-label"> 
   @html.labelfor(model => model.title) 
  </div> 
  <div class="editor-field"> 
   @html.textboxfor(model => model.title, new { style = "width:500px" }) 
   @html.validationmessagefor(model => model.title) 
  </div> 
  <div class="editor-label"> 
   @html.labelfor(model => model.information) 
  </div> 
  <div class="editor-field"> 
   @html.textareafor(model => model.information, new { style="width:800px;height:400px"}) 
   @html.validationmessagefor(model => model.information) 
  </div> 
  <p> 
   <input type="submit" value="create" /> 
  </p> 
 </fieldset> 
} 
<div> 
 @html.actionlink("返回列表", "index") 
</div>

修改页面一样，controller稍微有点修改：

[httppost] 
  [validateinput(false)] 
  public actionresult editnews(newsentity news) 
  { 
   if (modelstate.isvalid) 
   { 
    news.time = datetime.now; 
    pe.entry(news).state = entitystate.modified;//修改 
    pe.savechanges(); 
    return redirecttoaction("news"); 
   } 
   return view(news); 
  }

删除controller代码：

public actionresult deletenews(int id) 
  { 
   var model = pe.newsentity.find(id); 
   pe.newsentity.remove(model); 
   pe.savechanges(); 
   return redirecttoaction("news"); 
  }

小编刚接触mvc3,本文也只是本人学习中的一点点积累，有很多不好的地方，希望大家多提意思。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网