精华内容
下载资源
问答
  • 开发环境:VS2010 + SQL SERVER2005/2008 ASP.NET Extjs框架源码 教务系统框架源码 ASP.NET+Extjs框架 是一套非常成熟的框架程序,可直接用于大型系统基础框架快速开发,及程序员学习。
  • EXTJS框架

    2019-08-02 01:38:14
  • ExtJs框架

    2013-04-09 11:07:37
    我用ExtJs框架技术,现在我遇到了个问题,请高手们指教。。首先谢谢你们了。。。 就是我做了个页面,首先打开页面的时候数据是正确的,Ext.PagingToolbar分页还能用,没有错误。然后我在页面上放了个按钮,点击...
  • ExtJs框架与API.rar

    2019-07-19 08:49:29
    ExtJs框架与API.rar
  • Extjs框架总结

    千次阅读 2016-07-21 17:39:06
    Extjs框架知识总结概述Ext是基于Web的富客户端...以下是基于Extjs框架整合的demo。Extjs框架可分为五个部分: HTML页面:加载js插件,承载界面显示 Controller.js:控制各个组件,以及实现事件监听 View.js:实现页面

    Extjs框架知识总结

    概述

    Ext是基于Web的富客户端框架,其完全是基于标准W3C技术构建的,使用到的都是HTML、CSS、DIV等相关技术。Extjs提供了大量已经封装好的可以直接使用的组件,上手容易。以下是基于Extjs框架整合的demo。

    Extjs框架可分为五个部分:

    1. HTML页面:加载js插件,承载界面显示
    2. Controller.js:控制各个组件,以及实现事件监听
    3. View.js:实现页面的布局
    4. Store.js:提供数据信息,可以通过代理向后台获取表单数据
    5. Model.js:数据保存模块,用于保存Store获取的数据

    以下是各个模块实现是代码示例:
    HTML页面:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>Extjs示例</title>
        <link href="ext-4.2/resources/css/ext-all-gray.css" rel="stylesheet"/>
        <link href="resources/css/icon.css" rel="stylesheet"/>
        <script src="ext-4.2/ext-all.js"></script>
        <script src="ext-4.2/locale/ext-lang-zh_CN.js"></script>
        <script src="common.js"></script>
        <style type="text/css">
            .photo_css1 {
                height: 18px;
                width: 66px;
                cursor: pointer;
            }
    
            .photo_css2 {
                display: none;
            }
        </style>
    </head>
    <body>
    
    </body>
    <script>
        Ext.application({
            name: 'Cnu',
            controllers: ['Cnu.controller.CheckSummaryController'],
            launch: function () {
                Ext.create('Ext.container.Viewport', {
                    layout: 'fit',
                    items: [{
                        xtype: 'CheckSummaryView'
                    }]
                });
            }
        });
    </script>
    </html>

    Controller.js

    Ext.define("Cnu.controller.CheckSummaryController", {
        extend: 'Ext.app.Controller',
        views: ['demo.CheckSummaryView'],
        models: ['demo.CheckSummaryModel'],
        stores: ['demo.CheckSummaryStore'],
        refs: [
            {
                ref: 'CheckSummaryView',
                selector: 'CheckSummaryView'
            }
        ],
        init: function () {
            this.control({
                'CheckSummaryView button': {
                    click: this.btnEvent
                }
            });
        }
        ,
        btnEvent: function (selModel) {
            var grid = this.getCheckSummaryView();
    
            //var model = grid.getSelectionModel();
            if (selModel.iconCls == "icon-query") {//查询
                //点击搜索按钮将查询条件传递到后台
    //          model.clearSelections();//清空所有选择 
                var jobId = Ext.getCmp('jobId').getValue();
                var startTime = Ext.util.Format.date(Ext.getCmp('startTime').getValue(), 'Y-m-d');
                var endTime = Ext.util.Format.date(Ext.getCmp('endTime').getValue(), 'Y-m-d');
                var deptType = Ext.getCmp('deptType').getValue();
                //store 加载之前将参数放进去以待后台获取
                grid.store.on('beforeload', function (store, options) {
                    var new_params = {jobId: jobId, startTime: startTime, endTime: endTime,deptType: deptType};
                    Ext.apply(store.proxy.extraParams, new_params);
                });
                grid.store.load();
    
            }
        }
    
    });

    View.js

    Ext.define("Cnu.view.demo.CheckSummaryView", {
        extend: 'Ext.grid.Panel',
        xtype: 'CheckSummaryView',
        store: 'demo.CheckSummaryStore',
        initComponent: function () {
            //顶部工具栏 查询输入框
            this.tbar = [
                {
                    xtype: 'label', text: '工号:'
                },
                {
                    xtype: 'textfield', id: 'jobId',  emptyText: '请输入工号'
                },
                {
                    id:'startTime',
                    xtype : 'datefield',
                    //anchor: '100%',
                    name : 'startTime',
                    //hiddenName : 'bdate',
                    fieldLabel : '起始时间:',
                    format: 'Y-m-d',
                    allowBlank  : false,
                    listeners: {
                        change: function () {
                            var e = Ext.util.Format.date(Ext.getCmp('endTime').getValue(), 'Y-m-d');//格式化日期控件值
                            var s = Ext.util.Format.date(Ext.getCmp('startTime').getValue(), 'Y-m-d');//格式化日期控件值
                            var end = new Date(e);
                            var start = new Date(s);
                            var today = new Date();
                            if(start.getTime()>today.getTime()){
                                Ext.Msg.alert("提示:","不可大于当前时间!");
                                Ext.getCmp('startTime').setValue(null);
                            }else if(end.getTime() < start.getTime()) {
                                Ext.Msg.alert("提示","结束时间必须大于开始时间!");
                                Ext.getCmp('startTime').setValue(null);
                            }else if((today.getTime()-start.getTime())/86400000>31){
                                Ext.Msg.alert("提示:","只能查询最近30天的数据!");
                                Ext.getCmp('startTime').setValue(null);
                            }
    
                        }
                    },
                    value: new Date()  // defaults to today
    
                },
                //{xtype:'spacer', width:100},
    
               {
                    id:'endTime',
                    xtype : 'datefield',
                    //anchor: '100%',
                    name : 'endTime',
                    fieldLabel : '截止时间:',
                    format: 'Y-m-d',
                    allowBlank  : false,
                    listeners: {
                        change: function () {
    
                            var e = Ext.util.Format.date(Ext.getCmp('endTime').getValue(), 'Y-m-d');//格式化日期控件值
                            var s = Ext.util.Format.date(Ext.getCmp('startTime').getValue(), 'Y-m-d');//格式化日期控件值
                            var end = new Date(e);
                            var start = new Date(s);
                            var today = new Date();
                            if(end.getTime()>today.getTime()){
                                Ext.Msg.alert("提示:","不可大于当前时间!");
                                Ext.getCmp('endTime').setValue(null);
                            }else if(end.getTime() < start.getTime()) {
                                Ext.Msg.alert("提示","结束时间必须大于开始时间!");
                                Ext.getCmp('endTime').setValue(null);
                            }else if((today.getTime()-end.getTime())/86400000>31){
                                Ext.Msg.alert("提示:","只能查询最近30天的数据!");
                                Ext.getCmp('endTime').setValue(null);
                            }
    
    
                        }
                    },
                    value: new Date()  // defaults to today
    
                },
                {
                    id:'deptType',
                    xtype: 'combobox',
                    fieldLabel: '组织结构:',
                    name: 'deptType',
                    //hiddenName: 'STRATEGY_TYPE',
                    store: Ext.create('Ext.data.Store', {
                        fields: ['DEPARTMENT', 'DEPARTMENT_DESC'],
                        autoLoad:true,
                        proxy: {
                            type: 'rest',
                            url: rest_prefix+'/checksummary/getDept',
                            reader: {
                                type: 'json',
                                root: 'DATA'
                            }
                        }
                    }),
                    valueField: 'DEPARTMENT',
                    displayField: 'DEPARTMENT_DESC',
                    typeAhead: true,
                    queryMode: 'local',
                    editable:false,
                    allowBlank : false,
                    triggerAction: 'all',
                    emptyText: '请选择组织结构...'
                },
                {
                    text: '查询',
                    iconCls: 'icon-query'
                }
            ];
            this.columns = [
                {
                    header: '工号',
                    dataIndex: 'LOGIN_ID',
                    flex: 1
                },
                {
                    header: '姓名',
                    dataIndex: 'LOGIN_NAME',
                    flex: 1.2
                },
                {
                    header: '签入已签出次数',
                    dataIndex: 'LOGIN_NUM',
                    flex: 2
                },
                {
                    header: '签入已签出时长(小时)',
                    dataIndex: 'LOGIN_TIME',
                    flex: 1.1
                }
                ];
            this.callParent(arguments);
        },
        dockedItems: [
            {
                xtype: 'pagingtoolbar',
                store: 'demo.CheckSummaryStore',
                dock: 'bottom',
                displayInfo: true
            }
        ]
    });

    Store.js

    
    Ext.define("Cnu.store.demo.CheckSummaryStore", {
        extend: 'Ext.data.Store',
        model: 'Cnu.model.demo.CheckSummaryModel',
        pageSize: '15',
        autoSync: true,
        autoLoad: false,
        remoteFilter: true,
        remoteSort: true,
        proxy: {
            type: 'rest',
            url: rest_prefix + '/checksummary/checksummarylist',
            //actionMethods: {
            //    read: 'POST'
            //},
            reader: {
                type: 'json',
                root: 'DATA',
                totalProperty: 'totalCount'
            },
            writer: {
                type: 'json'
            }
        },
        /*sorters: [{property: 'CREATE_TIME', direction: 'DESC'}],*/
        listeners: {
            'beforeload': function (store, op, options) {
                /*var params = {
                    isUse: 0
                };
                Ext.apply(store.proxy.extraParams, params);*/
            }
        }
    });

    Model.js

    
    Ext.define('Cnu.model.demo.CheckSummaryModel', {
        extend: 'Ext.data.Model',
        fields: [
            {
                name: 'LOGIN_ID'
            },
            {
                name: 'LOGIN_NAME'
            },
            {
                name: 'LOGIN_NUM'
            },
            {
                name: 'LOGIN_TIME'
            }
    
        ],
    
        idProperty: 'LOGIN_ID'
    });

    后台代理部分具体实现略

    展开全文
  • ExtJs-工作坊 Sencha ExtJS 框架研讨会 工作区演示 - 创建一个类 - 用构造函数创建一个类 - 继承 - 配置的使用 - 布局 - 你好世界 - 视口 - 网格 - 网格到表单映射 - 本地化 - 休息 -
  • 精通JS脚本之ExtJS框架.pdf

    千次下载 热门讨论 2013-01-07 10:50:20
    《精通JS脚本之ExtJS框架》由浅入深地讲解了ExtJS在Web开发中的相关技术。《精通JS脚本之ExtJS框架》共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS...
  • extjs框架和实例

    2013-02-26 15:05:11
    extjs框架、实例。从入门到深入的全部例子
  • ExtJS是一个MVVM结构的JavaScript框架,在处理表格表单方面则是它的拿手好戏,这里整理了基本的JavaScript的ExtJS框架中表格的编写教程
  • ASP.NET+Extjs
  • Extjs框架基础.pptExtjs框架基础.ppt
  • 基于extjs框架实现的双日历功能
  • ExtJs框架(很实用的框架)能更好的 规划您的系统
  • EXTJS框架简介_有案例

    2012-05-22 13:00:48
    EXTJS框架简介里包含各种EXT框架案例,快速上手EXT之宝典
  • .net中的ExtJs框架,.net中的ExtJs框架,.net中的ExtJs框架 Demo:http://examples.ext.net/
  • TreePanel为ExtJS提供了一个方便的树结构数据展示,尤其是在处理JSON格式数据时十分常用,接下来我们就来看两则JavaScript的ExtJS框架中数面板TreePanel的使用实例解析
  • 使用ExtJS框架的项目的ESLint规则。 这些规则的目标是与ExtJS 4.x一起使用。 欢迎请求与5.x兼容的请求! 规则明细 ext-array-foreach ExtJS提供的两个主要的数组迭代器函数和不同之处在于, each函数都为早期终止...
  • 这是对ExtJS学习的一个小总结,做成了一...部分案例通过ExtJS页面直接操作后台数据,还包括了poi,jxl生成Excel表格的操作,以及grid在前台导出表格的实现,适合有一定JavaScript基础的人用来作为学习ExtJS框架的参考。
  • Extjs框架开发

    2015-09-29 17:31:55
    Extjs Web开发应用 源代码 Extjs是现在前端开发用的比较多得前端框架
  • extjs框架介绍

    2013-08-11 08:33:47
    这个是初学者的福音。看懂这个就可以更进一步的了解extjs框架结构。
  • ExtJs框架系列汇总

    2010-06-10 17:20:00
    将我在17EXT发的ExtJs框架系列汇总以下,便于大家查找讨论. ExtJs框架系列之GridCellActions http://www.17ext.com/showtopic-812.aspx<br />ExtJs框架系列之youtubeplayer ...

    将我在17EXT发的ExtJs框架系列汇总以下,便于大家查找讨论.

    ExtJs框架系列之GridCellActions http://www.17ext.com/showtopic-812.aspx

    ExtJs框架系列之youtubeplayer http://www.17ext.com/showtopic-810.aspx

    ExtJs框架系列之GroupCombobox http://www.17ext.com/showtopic-809.aspx

    ExtJs框架系列之密码强度 http://www.17ext.com/showtopic-808.aspx

    ExtJs框架系列之ProgressGrid http://www.17ext.com/showtopic-807.aspx

    ExtJs框架系列之Media,Picture展示 http://www.17ext.com/showtopic-736.aspx

    ExtJs框架系列之ImagesField http://www.17ext.com/showtopic-734.aspx

    ExtJs框架系列之SwfUploadPanel http://www.17ext.com/showtopic-616.aspx

    ExtJs框架系列之十二种EXT2的皮肤 http://www.17ext.com/showtopic-570.aspx

    【原创】ExtJs框架系列之图片批量显示,上传,删除 http://www.17ext.com/showtopic-482.aspx

    ExtJs框架系列之上传组件 http://www.17ext.com/showtopic-424.aspx

    ExtJs框架系列之GuiDesigner http://www.17ext.com/showtopic-815.aspx

    ExtJs框架系列之UploadPanel http://www.17ext.com/showtopic-833.aspx

    ExtJs框架系列之GoogleChart http://www.17ext.com/showtopic-834.aspx

    ExtJs框架系列之Combobox智能感知 http://www.17ext.com/showtopic-896.aspx

    ExtJs框架系列之Ext.ux.panel.DDTabPanel http://www.17ext.com/showtopic-2408.aspx

    ExtJs框架系列之Ext.ux.ExplorerView http://www.17ext.com/showtopic-2409.aspx

    ExtJs框架系列之Ext.ux.MinWindow http://www.17ext.com/showtopic-2410.aspx

    ExtJs框架系列之TreeMenu http://www.17ext.com/showtopic-2411.aspx

    ExtJs框架系列之IconCombobox http://www.17ext.com/showtopic-2657.aspx

    ExtJs框架系列之RowActions http://www.17ext.com/showtopic-3134.aspx

    ExtJs框架系列之Ext.ux.grid.CellToolTips http://www.17ext.com/showtopic-3714.aspx

    展开全文
  • Extjs框架简介

    2012-08-15 09:57:40
    首先声明:本文来自编程网站;... 作为一个刚接触ExtJS的...ExtJS框架简介: http://www.bianceng.cn/webkf/Extjs/201004/16583.htm       ExtJS2.0学习系列:  博客园 谦虚的天下  http://www.cnblogs.co...

    首先声明:本文来自编程网站;可点击页脚的链接阅读原文

    作为一个刚接触ExtJS的新手,受益匪浅;希望跟我一样的同学认真看完;

     

     

     

    ExtJS框架简介:

    http://www.bianceng.cn/webkf/Extjs/201004/16583.htm

     

     

     

    ExtJS2.0学习系列:

     博客园  谦虚的天下

     http://www.cnblogs.com/qianxudetianxia/archive/2008/08/29/1279730.html

    展开全文
  • 这是一本不错的extjs框架技术的学习资料,内容详细细致
  • 精通JS脚本之ExtJS框架978-7-122-10294-2_12756950
  • ExtJs框架系列之ProgressGrid进度条
  • TreePanel 为 ExtJS 提供了一个方便的树结构数据展示 ,尤其是在处理 JSON 格式数据时 十分常用 ,接下来我们就来看两则 JavaScript 的 ExtJS 框架中数面板 TreePanel 的使用实例解 析 在 ExtJS 中不管是叶子节点还是...
  • JSp编写实现的WEB版QQ聊天程序,界面基于EXTJS框架,界面漂亮是亮点哦。不过界面基本是套用EXTJS的。学习JSP的朋友,还是重点参考一下聊天的功能实现吧。
  • 记前端extjs框架中日期组件无效问题 框架:extjs 日期组件: 前端页面查看效果: 问题: 日期组件可以打开,但是选择操作不了。 原因: Ext之z-index问题。项目中引用的地图组件的js文件设置了Ext.WindowMgr.zseed...
  • extjs框架的帮助文档 非常有帮助,尤其是新人在开发的时候非常有帮助

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 17,545
精华内容 7,018
关键字:

extjs框架