第一个Extjs实例

最新推荐文章于 2021-06-18 12:32:46 发布
最新推荐文章于 2021-06-18 12:32:46 发布
阅读量101 收藏
点赞数
分类专栏： java web 文章标签： EXT JavaScript CSS HTML ViewUI

   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>添加人员</title>
  <script src="ext-3.0.0/adapter/ext/ext-base.js" type="text/javascript"></script>
   <script src="ext-3.0.0/ext-all.js" type="text/javascript"></script>
  <link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" />
  <script type="text/javascript">  
      Ext.onReady(function(){   
         var _window=new Ext.Window({
    title:"添加人员",
    width: 500,
    height: 350,
   plain:true,
   labelWidth:59,
   defaultType:"textfield",
   layout:"form",
   buttonAlign:"center",
   items:[
      {
        xtype:"panel",
     layout:"column",
     baseCls:"x-plain",
     style:"padding:5px",
        items:[
                    {
         columnWidth:.5,
       defaultType:"textfield",
       layout:"form",
       baseCls:"x-plain",
       defaults:{width:160},
       labelWidth:55, 
          items:[{  
                            fieldLabel:"姓名"
                        },
      {   
                            fieldLabel:"密码"   
                        },{   
                            fieldLabel:"性别",
       readOnly:true   
                        },{   
          xtype:"datefield",
       format:"Y-m-d",
       value:new Date(),
       readOnly:true,
                            fieldLabel:"日期" ,
       listeners:{
        "blur":function(_df){
         var d=_df.ownerCt.findByType("textfield")[2];
         d.setValue(new Date().getFullYear()-_df.getValue().getFullYear());
        }
       }  
                        },{   
                            fieldLabel:"联系电话"   
                        },{   
                            fieldLabel:"性别",
       xtype:"combo",
       displayField:"sex",
       mode:"local",
       readOnly:true,
       triggerAction:"all",
       value:"男",
       store:new Ext.data.SimpleStore({
        fields:["sex","b"],
        data:[["男","a"],["女","b"]]
        
       })
                        }]   
     },
      {
         columnWidth:.5,
       defaultType:"textfield",
       layout:"form",
       labelWidth:55,
       baseCls:"x-plain",
          items:[{   
                            fieldLabel:"个人照片",
       inputType:"image",
       width:170,
       height:160   
                        }]   
     }    
      ]
      },{
         xtype:"panel",
         layout:"form",
      baseCls:"x-plain",
      defaultType:"textfield",
      style:"padding:5px",
      labelWidth:55,
      items:[
         {
       fieldLabel:"身份证号",
      width:400
      },
      {
       fieldLabel:"具体地址",
      width:400
      },
      {
       xtype:"panel",
      layout:"column",
      baseCls:"x-plain",
      items:[
        {
         columnWidth:.5,
         layout:"form",
       defaultType:"textfield",
       baseCls:"x-plain",
       labelWidth:55,
       items:[
         {
          fieldLabel:"职务",
        xtype:"combo",
        readOnly:true,
        triggerAction: 'all',
        mode: 'local',
                                store: new Ext.data.SimpleStore({
                                fields: [
                                       'job'
                                     ],
                                data: [["程序员"], ["高级程序员"]]
                                  }),
        displayField: 'job'
        
         }
       ]
        },
        {
         columnWidth:.5,
       baseCls:"x-plain",
       layout:"column",
       items:[
         {
          xtype:"panel",
        columnWidth:.3,
        baseCls:"x-plain",
        items:[
          {
           xtype:"button",
         text:"添加职务"
          }
        ]
         },
         {
          xtype:"panel",
        baseCls:"x-plain",
        columnWidth:.3,
        items:[
          {
           xtype:"button",
         text:"修改职务"
          }
        ]
         },
          {
          xtype:"panel",
        baseCls:"x-plain",
        columnWidth:.4,
        items:[
          {
           xtype:"button",
         text:"删除职务"
          }
        ]
         }
       ]
        }
      ]
      }
      ]
      }
   ],
   showLock:false,   
                listeners:{   
                    "show":function(_window){   
                                       
                                    if(!_window["showLock"]){  
                                        _window.findByType("textfield")[6].getEl().dom.src = "1.gif" ;   
                                        _window["showLock"] = true;   
                                       
                                    }  
                             }   
                },   
                buttons:[{   
                    text:"确定"  
                },{   
                    text:"取消"   
                }]   
   }
   ).show();
    }) ;   
       
</script>  

  
 </head>
 <body>
 </body>
</html>

yutaozxy
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ExtJs入门实例(内含N个实例源码)
01-24
ExtJS入门实例、包含各种详细代码，非常适合初学者学习
jQuery与ExtJS之选择实例分析
10-28
这段代码首先等待DOM准备就绪，然后初始化tablesorter插件，设置初始排序为第一列，并启用zebra widget以实现行间条纹效果。同时，通过headers选项禁用了第五列的排序功能。 相比之下，ExtJS是一个更全面的框架，...
第一个EXTJS例子
先相信你自己，然后别人才会相信你。
09-11 125
搭建好MyEclipse平台上EXTJS的开发环境后就可以进行extjs的开发，下面给出一个最最简单的例子： &lt;%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%&gt; &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&
ExtJS表单之一个实例
evilcry2012的专栏
01-25 1051
ExtJS表单之一个实例 博客分类：  ExtJS   作者：zccst  一个实例，包含了大多数表单控件  截图    代码如下  Php代码   Ext.onReady(function() {                  Ext.QuickTips.init();           Ext.form.Fie
一个ExtJS实例
程序员小董的专栏
05-12 788
聊聊ExtJS 这几天接触了一个项目 前台用的是extjs 发现这个东西还是有点意思的  就把前台的部分 剥离了下来 有兴趣的朋友可以当做模板学习 不多说先上效果图 这篇文章 可以看作是ext知识的一个汇总 因此我不想讲太多细碎的知识点 但我会一一之命这些知识点在哪里可以找到 另一方面 ext细碎的知识点确实太多 自己没有精力也不想搞的太清楚 够用就行
一个ExtJs实例
程序员小董的专栏
02-28 2622
聊聊ExtJS这几天接触了一个项目 前台用的是extjs 发现这个东西还是有点意思的 就把前台的部分 剥离了下来 有兴趣的朋友可以当做模板学习不多说先上效果图这篇文章 可以看作是ext知识的一个汇总因此我不想讲太多细碎的知识点 但我会一一之命这些知识点在哪里可以找到另一方面 ext细碎的知识点确实太多 自己没有精力也不想搞的太清楚 够用就行我会说一些 我认为最重要的部分首先 希望大家看看这篇文章h
ExtJS 4.2 第一个程序
weixin_39037804的博客
10-17 140
本篇介绍如何创建一个ExtJS应用程序。并通过创建目录、导入文件、编写代码及分析代码等步骤来解释第一个ExtJS程序。 目录 1. 创建程序 　　1.1 创建目录建议 　　1.2 实际目录 　　1.3...
php extjs 实例,Extjs单独定义各组件的实例代码_extjs
weixin_34337134的博客
03-26 205
网上看到的一个事例，其中包含了组件的定义拷贝下来供大家参考：Ext.onReady(function(){var dtCategory=[['all','所有种类'],['1','Beverages'],['2','Condiments'],['3','Confections'],['4','Dairy Products'],['5','Grains/Cereals'],['6','Meat/Po...
extjs html 布局实例,谈谈Ext JS的组件——布局的使用方法
weixin_35081861的博客
06-18 276
概述在ExtJS中，包含两类布局：组件类布局和容器类布局。由于有些组件是有不同的组件组合而成的，如字段就由标题和输入框构成，他们之间也是存在布局关系的，而这就需要组件类布局来处理组件内自己特有的布局关系。如果我们不定义自己的组件，基本不需要使用到组件布局，知道就行了。本文主要介绍的是容器类布局，因为这个在开发中是必定会使用到的。注意：在Ext JS中，字段有两层意思。在模型中所说的字段，与数据库中...
extjs2.02入门第一个实例
chuenux
01-12 100
[code="java"] extjs实例 [/code] [code="java"] Ext.onReady( function(){ Ext.MessageBox.alert("hello","Hello World!"); } ) [/code]
ExtJs实例代码
05-30
强大的美化与功能多样化，你第一个想到的应该是ExtJs ExtJS是一种主要用于创建前端用户界面，是一个基本与后台技术无关的前端ajax框架。 功能丰富，无人能出其右。 无论是界面之美，还是功能之强，ext的表格控件...
ExtJS 学习专题（一） 如何应用ExtJS（附实例）
10-29
要开始使用ExtJS，第一步是获取库文件。可以通过访问官网提供的下载页面（***/products/gxt/download.php）下载ZIP压缩文件。下载后，解压到本地目录，例如【D:\ExtCode】。解压后，你将看到如下结构的文件夹和文件...
ExtJS tabPanel实例
07-11
// 移除第一个标签页 ``` 3. 配置标签页： `tabPanel` 的每个标签页都是一个单独的组件，可以有自己的配置项，比如图标、关闭按钮等： ```javascript { title: '权限管理', iconCls: 'icon-rights', // 图标...
extjs html 布局实例,Ext 表单布局实例代码
weixin_35612315的博客
06-18 120
Ext.onReady(function(){Ext.QuickTips.init();//第一句的目的是为需要的元件提供提示信息功能，form的主要提示信息就是客户端验证的错误信息了。Ext.form.Field.prototype.msgTarget = 'under';//第二句的目的就是设置控件的错误信息显示位置，主要可选的位置有：var tdate = new Ext.form.Date...
聚类算法实现本次作业实现了3个经典算法：KNN算法、K-Means算法、朴素贝叶斯算法
最新发布
08-15
本次作业实现了3个经典算法：KNN算法、K-Means算法、朴素贝叶斯算法。
LSTM的批处理智慧：解锁高效序列学习之门
08-15
LSTM（Long Short-Term Memory）是一种特殊类型的循环神经网络（RNN），它能够学习长期依赖关系。LSTM由Hochreiter和Schmidhuber在1997年首次提出，它是为了解决传统RNN在处理长序列数据时遇到的梯度消失或梯度爆炸问题而设计的。 LSTM的关键特性是它的单元结构，这些单元具有以下三个主要组件： 1. **遗忘门（Forget Gate）**：遗忘门决定哪些信息应该从单元状态中被丢弃。它通过一个sigmoid激活函数来实现，输出一个0到1之间的值，表示保留信息的程度。 2. **输入门（Input Gate）**：输入门由两部分组成，一部分是sigmoid层，决定哪些值将要更新存储在单元状态的信息；另一部分是tanh层，创建一个新的候选值向量，它可以被加入到状态中。 3. **输出门（Output Gate）**：输出门决定下一个隐藏状态的值，它通过sigmoid层来确定隐藏状态的哪些部分将被输出，然后通过tanh层来计算最终的输出值。 LSTM的单元结构允许网络在每个时间步长上选择性地保留或更新信息，这使得LSTM非常适合处理和预
毕业设计asp.net招聘网站源码含文档工具包
08-15
毕业设计asp.net招聘网站源码含文档工具包 asp.net，数据库sqlserver，开发工具用Microsoft Visual Studio 学生用户 求职应聘 登录系统 岗位消息 管理员 新闻动态 毕业生信息 登录系统后台 招聘公司 毕业生注册 系统后台 公司注册 联系我站 用户管理 数据备份 数据恢复 帐号管理 包含：源码、数据库脚本、论文、答辩ppt、开题报告、环境工具包（在说明文档中）
聚类算法新纪元：动态更新机制的突破与实践
08-15
聚类算法是一种无监督学习算法，用于将数据集中的样本分组，使得同一组内的样本相似度高，而不同组之间的样本相似度低。聚类算法的目标是发现数据的内在结构，而不需要事先给出标签或指导信息。 聚类算法的常见类型包括： 1. **K-Means 聚类**：这是最常用的聚类算法之一，通过迭代选择K个中心点，将数据点分配到最近的中心点所代表的簇中，然后更新中心点的位置，直到满足停止条件。 2. **层次聚类**：这种算法不需要预先指定簇的数量，它通过逐步合并或分裂来构建一个层次嵌套的簇树。 3. **DBSCAN (Density-Based Spatial Clustering of Applications with Noise)**：基于密度的聚类算法，可以发现任意形状的簇，并且对噪声点具有较好的鲁棒性。 4. **Mean Shift 聚类**：这是一种基于密度的非参数聚类算法，通过寻找密度函数的局部极大值点来确定簇的中心。 5. **Spectral Clustering 谱聚类**：这种算法使用数据的谱特性来进行聚类，通常涉及到将数据映射到低维空间。 6. **Affinit
精通Extjs：实例与应用指南
这篇文档是关于Extjs开发的一个实例教程，适合开发者在实际项目中查询和学习使用。它涵盖了从基础到进阶的多个主题，旨在帮助读者掌握Extjs的使用。 首先，文档介绍了准备工作，包括如何下载Extjs库，可能遇到的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值