ExtJs2.0学习系列(14)--Ext.TreePanel之第三式(可增删改的树)

继续tree的learn! 今天就来个可增删改的树吧,操作数据库就使用比较方便的Linq,无非就是增删改!

LinqData.dbml:


html代码:

<body>    <div id="container" style="float:left; margin-right:10px;">    </div>    <iframe name="mainFrame" id="mainFrame" src="http://www.baidu.com" width="200px" height="200px"></iframe></body>

css代码:

<style type="text/css">       .leaf       {             background-image:url(ExtJs/resources/images/default/tree/leaf.gif) !important;               }<!--节点右键菜单的叶子图片-->       .folder       {               background-image:url(ExtJs/resources/images/default/tree/folder.gif) !important;               }<!--节点右键菜单的文件夹图片--></style>

效果图:

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索extjs
, 代码
, tree
, treepanel
, resources
, default
, 删改
, 增删改
, ext.TreePanel
, tree数据增删改
, 增
, yii增删改查实例
, jquery_easyui增删改
background-image
,以便于您获取更多的相关知识。

时间: 2024-08-04 13:39:59

ExtJs2.0学习系列(14)--Ext.TreePanel之第三式(可增删改的树)的相关文章

ExtJs2.0学习系列(12)--Ext.TreePanel之第一式

今天开始,我们就开始一起学习TreePanel了,道个歉,上篇的代码很乱阿. 我总是喜欢用最简单的例子开始,去理解最基本的使用方法,减少对i后面高级使用的干扰! TreePanel是继承自Panel,所以很多在Panel中谈到的属性这里可能会一笔带过,如有问题,请参考ExtJs2.0学习系列(2)--Ext.Panel 1.第一个静态树--最简单的树 效果图: html代码: <div id="container"> </div> js代码: Ext.onRea

ExtJs2.0学习系列(6)--Ext.FormPanel之第三式(ComboBox篇)

前言:说句实话,此extjs系列的文章在博客园中的热度不高,可能是学这玩意的人不多吧,但是我觉得有这么个系列的文章对于中国朋友非常有帮助!请大家支持! 上篇ExtJs2.0学习系列(5)--Ext.FormPanel之第二式中我们讨论了下fieldset和表单验证的知识,今天我们接着深入解析表单元素中ComboBox组件的使用.会涉及 到.net简单服务器数据交互,但暂不做深入讨论,以后会详细分析服务器交互相关,不过可能要等较长一段时间,呵呵! 5.服务器数据作为ComboBox的数据源实例 首

ExtJs2.0学习系列(13)--Ext.TreePanel之第二式

昨天有朋友说,在IE下有的时候ashx传过来的节点不能加载,其实我也出现这样的问题,很是烦人! 今天extjs上看到了一个解决方案,觉得很好:如果treeLoader加载失败,会继续加载,直到成功加载. 4.解决IE下非正常加载节点问题 即使从服务器取到大量的数据,也没有问题. -- 基本代码一样,只有js代码的loader小小的修改下: loader:new Ext.tree.TreeLoader({ url:"json.ashx", listeners:{ "loadex

ExtJs2.0学习系列(2)--Ext.Panel

上一篇文章ExtJs2.0学习系列(1)--Ext.MessageBox ,受到了大家的褒贬不一,还是有的朋友提出好的建议,在此表示感谢! 今天介绍extjs中的Panel组件. //html代码 <div id="container"> </div> //js代码 var p = new Ext.Panel({ title: 'My Panel',//标题 collapsible:true,//右上角上的那个收缩按钮,设为false则不显示 renderTo:

ExtJs2.0学习系列(3)--Ext.Window

前面介绍了panel组件--ExtJs2.0学习系列(2)--Ext.Panel,今天将介绍window组件,它继承自panel. 先介绍个最简单例子 //html代码 <div id="win" class="x-hidden"> </div> //js代码 var w=new Ext.Window({ contentEl:"win",//主体显示的html元素,也可以写为el:"win" width

ExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇)

N久没有写extjs的,作为一个新手,我为我的这种懒惰行为感到惭愧! 鉴于有朋友反应前面的文章过于简单,我决定以后的文章如果没有闪光点就放在新手区(如果不适合,请跟帖),不放在首页! 11.checkbox简单示例 效果图: js代码: Ext.onReady(function(){ Ext.QuickTips.init(); var myform=new Ext.FormPanel({ frame:true, width:330, layout:"form", labelWidth:

ExtJs2.0学习系列(1)--Ext.MessageBox

大家都知道,刚开始搞extjs的时候,很是有点困难,所以本人在新手刚入门后准备了这个系列的文章. 个人认为用extjs做后台很不错,布局比较完美! 1.Ext.MessageBox.alert()方法 有四个参数,为简单起见,主要介绍前面三个参数: alert( title , msg , function(){} ) 其中title,msg为必选参数,function为可选参数,在关闭弹出窗口后触发. Ext.MessageBox.alert("title","msg&qu

ExtJs2.0学习系列(10)--Ext.TabPanel之第二式

上一篇种我们简单的了解了下tabpanel 下面我们要介绍的是,如何动态的添加标签页! 2.动态添加tabpanel的标签页 效果图: 点击"添加新标签页",会添加一个标签页,而且激活这个新的标签页. html代码: <body style="margin:10px;"> <div> <a id="AddNewTab" href="javascript:void(0)">添加新标签页<

ExtJs2.0学习系列(11)--Ext.XTemplate

XTemplate是Extjs里面的模板组件. 下面我们看个最简单的例子. 效果图: js代码: Ext.onReady(function(){ //数据源 var data={ name:"博客园", read:[{ book:'<<道不远人>>', date:'2007-7-7' },{ book:"<<大话设计模式>>", date:"2006-6-6" }] } //呈现组件 var myp