上一篇文章对Telerik MVC Extensions作了一个大概的介绍,这篇文章将介绍如何将Telerik MVC Extensions添加到项目中。有以下两种方式可以将Telerik MVC Extensions添加到项目中,请任选其一,

以下vs2010为例,演示如果添加Telerik MVC Extensions

一、通过nuget添加Telerik MVC Extensions

1. 安装Nuget

2. 新mvc3 项目,并在Nuget中添加Telerik MVC Extensions

3. 修改web.config

在views文件夹中的web.config中添加

<add namespace="Telerik.Web.Mvc.UI" />

4. 修改_Layout.cshtml

a. 在页头注册css

@(Html.Telerik().StyleSheetRegistrar().DefaultGroup(group => group.Add("telerik.common.css").Add("telerik.black.css").Combined(true).Compress(true)))

b. 在页尾注册js

@(Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Combined(true).Compress(true)))

5.  安装完毕,并验证Telerik MVC Extensions是否已经安装成功

a. 在首页添加如下代码:

   1: @(Html.Telerik().Menu()
   2:       .Name("TelerikMenu")
   3:       .Items(items =>
   4:       {
   5:             items.Add().Text("Awesome")
   6:                  .Items(subItems =>
   7:                  {
   8:                      subItems.Add().Text("Awesome Sauce");
   9:                  });    
  10:       })
  11: ) 

b. 运行程序

如果运行结果如下,则安装成功

二、通过Telerik MVC VSExtensions添加Telerik MVC Extensions

1. 在Vs插件管理器中安装Telerik MVC VSExtensions

2. 创建Telerik Mvc 3 Application

3. 安装完毕,并验证Telerik MVC Extensions是否已经安装成功

a. 在首页添加如下代码:

   1: @(Html.Telerik().Menu()
   2:       .Name("TelerikMenu")
   3:       .Items(items =>
   4:       {
   5:             items.Add().Text("Awesome")
   6:                  .Items(subItems =>
   7:                  {
   8:                      subItems.Add().Text("Awesome Sauce");
   9:                  });    
  10:       })
  11: ) 

b. 运行程序

如果运行结果如下,则安装成功

注:安装Telerik MVC VSExtensions后,也可通过此工具将标准的mvc项目转换成Telerik MVC项目

[2]Telerik Extensions for ASP.NET MVC 中文教程(2)的更多相关文章

  1. [1]Telerik Extensions for ASP.NET MVC 中文教程(转)

    http://demos.telerik.com/aspnet-mvc/ Telerik Extensions for ASP.NET MVC 是Telerik 公司专门针对Asp.net MVC 开 ...

  2. [5]Telerik Extensions for ASP.NET MVC 开发问题

    1.Controller获取不到checkedNodes的问题 HTML @(Html.Telerik().TreeView()        .Name("TreeView")  ...

  3. UI控件Telerik UI for ASP.NET MVC全新发布R2 2019 SP1

    Telerik UI for ASP.NET MVC拥有使用JavaScript和HTML5构建网站和移动应用所需的70+UI部件,来满足开发者的各种需求,提供无语伦比的开发性能和用户体验.它主要是针 ...

  4. 【转】ASP.NET MVC 入门教程列表

    ASP.NET MVC小论 2008-12-04 11:11 by T2噬菌体, 8052 visits, 网摘, 收藏, 编辑 摘要:ASP.NET MVC作为微软官方的.NET平台下MVC解决方案 ...

  5. 【译】ASP.NET MVC 5 教程 - 11:Details 和 Delete 方法详解

    原文:[译]ASP.NET MVC 5 教程 - 11:Details 和 Delete 方法详解 在教程的这一部分,我们将研究一下自动生成的 Details 和Delete 方法. Details ...

  6. 【译】ASP.NET MVC 5 教程 - 10:添加验证

    原文:[译]ASP.NET MVC 5 教程 - 10:添加验证 在本节中,我们将为Movie模型添加验证逻辑,并确认验证规则在用户试图使用程序创建和编辑电影时有效. DRY 原则 ASP.NET M ...

  7. 【译】ASP.NET MVC 5 教程 - 9:添加新字段

    原文:[译]ASP.NET MVC 5 教程 - 9:添加新字段 在本节中,我们将使用Entity Framework Code First 数据迁移功能将模型类的改变应用到数据库中. 默认情况下,当 ...

  8. 【译】ASP.NET MVC 5 教程 - 8:搜索查询

    原文:[译]ASP.NET MVC 5 教程 - 8:搜索查询 添加一个搜索的方法和搜索的视图 在本节中,我们为 Index 方法添加查询功能,使我们能够根据电影的题材或名称进行查找. 修改 Inde ...

  9. 【译】ASP.NET MVC 5 教程 - 7:Edit方法和Edit视图详解

    原文:[译]ASP.NET MVC 5 教程 - 7:Edit方法和Edit视图详解 在本节中,我们继续研究生成的Edit方法和视图.但在研究之前,我们先将 release date 弄得好看一点.打 ...

随机推荐

  1. Force.com微信开发系列(七)OAuth2.0网页授权

    OAuth是一个开放协议,允许用户让第三方应用以安全且标准的方式获取该用户在某一网站上存储的私密资源(如用户个人信息.照片.视频.联系人列表),而无须将用户名和密码提供给第三方应用.本文将详细介绍OA ...

  2. C++pair类型

    标准库类型--pair类型定义在utility头文件中定义 本文地址:http://www.cnblogs.com/archimedes/p/cpp-pair.html,转载请注明源地址. 1.pai ...

  3. 关于一个软件ipa包的其他图片资源

    有时候 当你打开一个ipa包内容的时候    可能会找不到全部的资源     所以你需要在github上下载一个插件 下载下来以后   运行一下 然后会出来这个 把ipa  文件   拖到里面     ...

  4. SSH整合简述一

    1.web.xml中配置 struts2过滤器 <filter> <filter-name>struts2</filter-name> <filter-cla ...

  5. IOS 杂笔-8(loadView、viewDidLoad、viewWillAppear、viewDidAppear等简介)

    loadView; This is where subclasses should create their custom view hierarchy if they aren't using a ...

  6. 【原】自定义UIPageControl的圆点

    在下面的两种情况下会导致圆点贴图刷新: 1.用户调用setCurrentPage:(NSInteger)currentPage时 所以重载这个函数便可拦截 2.点击圆点矩形区域时     这说明,我们 ...

  7. 关于bitcode~

    最近在做语音识别- 在真机调试的时候一直报 ld: '/Users/Chenglijuan/Documents/语音识别/lib/iflyMSC.framework/iflyMSC(IFlyRecog ...

  8. IOS之KVC和KVO(未完待续)

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  9. Objective-C之@类别小实例

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  10. yum安装mariadb

    安装mysql yum install mariadb mariadb-server MySQL-python mysql-devel Package MySQL-python-1.2.5-1.ibm ...