Easyui + asp.net mvc + sqlite 开发教程(录屏)适合入门

第一节:

前言(技术简介)

EasyUI 是一套 js的前端框架 利用它可以快速的开发出好看的 前端系统 web 它是在jquery的框架基础上面

现在越来越多的 企业用它来开发web系统

extjs (功能很强大 但是非常复杂 速度 我感觉也没有 easyui快)

easyui (比较适合初学者 小巧 而且 速度感觉还是可以 相对ext来说 )

ASP.NET MVC

Sqlite 数据库

(一个小型的数据库 不用安装 很多单机软件 利用他来做数据保存)

工具 动软代码生成器 IDE(VS2010)

物理框架是 win7 64位

逻辑框架 三层 data business UI

MVC ASP.NET MVC

MVC 是在 .net 3.5 以后才有的一个东西

下载easyui

  外链资源: easyui下载 地址:http://www.jeasyui.com/download/downloads/jquery-easyui-1.3.2.zip

在asp.net MVC中添加 easyui

第二节:

创建一个home页的view

index.aspx 在里面添加easyui的应用支持(添加js 和css)

<script src="../../Content/Easyui/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="../../Content/Easyui/jquery.easyui.min.js" type="text/javascript"></script>
<script src="../../Content/Easyui/easyui-lang-zh_CN.js" type="text/javascript"></script>
<link href="../../Content/Easyui/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<link href="../../Content/Easyui/themes/icon.css" rel="stylesheet" type="text/css" />

布局 我们使用 easyui的 layout

<body class="easyui-layout">
<div data-options="region:'north',border:false" style="height:40px;background:#0099C8;padding:10px">logo</div>
<div data-options="region:'west',split:true,title:'菜单栏'" style="width:150px;padding:10px;">
<ul id="tt"></ul>
</div>
<div data-options="region:'south',border:false" style="height:20px;background:#ccc;padding:1px;">北盟学习社区 当前登录人: admin</div>
<div data-options="region:'center',title:'Center'"></div>
<script type="text/javascript">
$('#tt').tree({
url: '/Prim/Index',
checkbox: true
});
</script>
</body>

这样 一个简单的布局 就搞定了

easyui 布局的时候 我们要修改layout panel的一些样式

但这里有一点要注意的 就是 五个region 其他都可以没有 但是 “'center',title:'” 这个 必须有

<div data-options="region:'north',border:false" style="height:40px;background:#0099C8;padding:10px">logo</div>
<div data-options="region:'west',split:true,title:'菜单栏'" style="width:150px;padding:10px;">
<ul id="tt"></ul>
</div>
<div data-options="region:'south',border:false" style="height:20px;background:#ccc;padding:1px;">北盟学习社区 当前登录人: admin</div>
<div data-options="region:'center',title:'Center'"></div>
 $( '#tt').tree({
            onClick: function (node) {//菜单树 的点击事件
                //alert(node.attributes.url);  // alert node text property when clicked
                //接下来是添加一个tab
                $( '#tabs' ).tabs('add' , {
                    title: node.text,
                    iconCls: 'icon-ok' ,
                    content: 'asdfsdfsdfsdfsd' ,
                    closable: true
                });
            }
        });

视频下载地址:

  外链资源: Easyui+asp.net mvc实用教程 第01节 Easyui Mvc Sqlite介绍 和三层的搭建

  外链资源: 第02节 Easyui的引入和搭建 布局

  外链资源: Easyui+asp.net mvc实用教程第03节

[北盟学习bamn.cn][Easyui+asp.net mvc实用教程] 第08节 tab动态显示一个独立的页面

http://pan.baidu.com/share/link?shareid=3973583294&uk=540184145

[北盟学习bamn.cn][Easyui+asp.net mvc实用教程] 第07节 Easyui的Tab的使用 动态添加 tab 和easyui的事件 方法 属性的调用形式

http://pan.baidu.com/share/link?shareid=3981103915&uk=540184145

[北盟学习bamn.cn][Easyui+asp.net mvc实用教程] 第05节 Easyui的accordion的使用 修改图标

http://pan.baidu.com/share/link?shareid=3986162885&uk=540184145

[北盟学习bamn.cn][Easyui+asp.net mvc实用教程] 第04节 Easyui的tree控件的使用 html形式 json形式 和修改图标

http://pan.baidu.com/share/link?shareid=3992365026&uk=540184145

源码下载:http://www.bamn.cn/viewthread.php?tid=21&extra=page%3D1

第六集 视频下载

第06节 Easyui的Tab的使用 和菜单的点击事件 菜单添加URL

http://pan.baidu.com/share/link?shareid=733465464&uk=540184145

分类: C#辅助

Easyui + asp.net mvc + sqlite 开发教程(录屏)适合入门的更多相关文章

  1. Easyui + asp.net MVC 系列教程 完成登录

    Easyui + asp.net MVC 系列教程 第09-17 节 完成登录 高清录制 前面八节 在这里 Easyui + asp.net mvc + sqlite 开发教程(录屏)适合入门 在接下 ...

  2. Easyui + asp.net MVC 系列教程 第19-23 节 完成注销 登录限制过滤 添加用户

    前面视频 文章地址 Easyui + asp.net MVC 系列教程 第09-17 节 完成登录 高清录制  Easyui + asp.net mvc + sqlite 开发教程(录屏)适合入门  ...

  3. Easyui + asp.net MVC 系列教程 第09-17 节 完成登录 高清录制

    前面八节 在这里 Easyui + asp.net mvc + sqlite 开发教程(录屏)适合入门 在接下来的 几节里面 我们完成登录功能 打开页面 首先进入登录页面 只有登录成功了 才能进入管理 ...

  4. ASP.NET MVC 5 学习教程:快速入门

    起飞网 ASP.NET MVC 5 学习教程目录: 添加控制器 添加视图 修改视图和布局页 控制器传递数据给视图 添加模型 创建连接字符串 通过控制器访问模型的数据 生成的代码详解 使用 SQL Se ...

  5. ASP.NET MVC 5 学习教程:数据迁移之添加字段

    原文 ASP.NET MVC 5 学习教程:数据迁移之添加字段 起飞网 ASP.NET MVC 5 学习教程目录: 添加控制器 添加视图 修改视图和布局页 控制器传递数据给视图 添加模型 创建连接字符 ...

  6. ASP.NET MVC 5 学习教程:添加模型

    原文 ASP.NET MVC 5 学习教程:添加模型 起飞网 ASP.NET MVC 5 学习教程目录: 添加控制器 添加视图 修改视图和布局页 控制器传递数据给视图 添加模型 创建连接字符串 通过控 ...

  7. ASP.NET MVC 5 学习教程:添加控制器

    原文 ASP.NET MVC 5 学习教程:添加控制器 起飞网 ASP.NET MVC 5 学习教程目录: 添加控制器 添加视图 修改视图和布局页 控制器传递数据给视图 添加模型 创建连接字符串 通过 ...

  8. ASP.NET MVC企业开发的基本环境

    ASP.NET MVC企业开发的基本环境[资源服务器概念] 学完了ASP.NET MVC4 IN ACTION 六波以后 企业开发演习 标签:AaronYang  茗洋  EasyUI1.3.4   ...

  9. Asp.net Mvc模块化开发之分区扩展框架

    对于一个企业级项目开发,模块化是非常重要的. 默认Mvc框架的AreaRegistration对模块化开发真的支持很好吗?真的有很多复杂系统在使用默认的分区开发的吗?我相信大部分asp.net的技术团 ...

随机推荐

  1. 教你一步一步部署.net免费空间OpenShift系列之四------绑定域名、使用CDN加速

    很抱歉这几天没有时间,有人问我怎么绑定域名的问题也没有答复,下面进入正题,惊闻ASP.Net要开源了,难道.Net春天要来了?不废话,上回书说,部署完毕ASP.Net网站后,直接访问不能访问(嗯,众所 ...

  2. Hadoop-2.4.1完全分布式环境搭建

      Hadoop-2.4.1完全分布式环境搭建   Hadoop-2.4.1完全分布式环境搭建 一.配置步骤如下: 主机环境搭建,这里是使用了5台虚拟机,在ubuntu 13系统上进行搭建hadoop ...

  3. WCF与Web API 区别

    WCF与Web API 区别(应用场景)   Web api  主要功能: 支持基于Http verb (GET, POST, PUT, DELETE)的CRUD (create, retrieve, ...

  4. Android注入事件的三种方法比较

    方法1:使用内部APIs 该方法和其他所有内部没有向外正式公布的APIs一样存在它自己的风险.原理是通过获得WindowManager的一个实例来访问injectKeyEvent/injectPoin ...

  5. 过度补脑系列:Nokia的不归路

    没有数据,没有调查,只是突然想起诺基亚... 23号的一节酱油课,脑海中突然闪过两个关键字--nokia & android 于是用手机百度了一下,竟然真的出了新机型,NokiaX,X东24日 ...

  6. IntelliJ IDEA对开发者的三大诱惑

    IntelliJ IDEA作为最聪明的Java开发工具,不在只是对Java语言的支持,其中还包括Scala,Groovy 和其他语言. 对于任何一个开发者,好的工具就是为提高开发效率的.那么Intel ...

  7. CSS3教程:box-sizing属性的理解border、padding与容器宽度的关系

    说到 IE 的 bug,一个臭名昭著的例子是它对于“盒模型”的错误解释:在 IE5.x 以及 Quirks 模式的 IE6/7 中,将 border 与 padding 都包含在 width 之内.这 ...

  8. mysql的事物

    所谓的事物就是一组原子性的SQL语句,或者说是一个独立的工作单元. 1.事物拥有四大特征: ①原子性(atomicity):一个事物必须被分为一个不可分割的的最小单元,整个事物中的所有操作要么全部提交 ...

  9. 18 个最新实用的 jQuery 插件

    1. Simple Effects for Drop-Down Lists 一个jQuery插件用于将普通的select控件转成一个带有一些简单扩展效果的下拉列表. 2. X-editable 这个插 ...

  10. 按照鬼哥学so变化,四,第一章的例子

    跟随鬼哥伦比亚科学so变化,四.第一章的例子 图纸/文化  听鬼哥说故事 ---------------------------------------------切割线--------------- ...