- 浏览: 3322598 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (567)
- Web前端-html/表单 (19)
- Web前端-CSS (24)
- Web前端-CSS框架 (4)
- Web前端-JS语言核心 (50)
- Web前端-JS客户端 (26)
- nodejs生态+grunt (10)
- seajs和requirejs (9)
- backbone等框架 (7)
- 模板基础 (7)
- Web前端-deps(不改动) (6)
- Web前端-component (10)
- Web前端-jquery-plugin (13)
- 浏览器兼容性 (6)
- Web前端-使用jQuery (25)
- Web前端-使用jqueryui (6)
- Web前端-性能优化 (3)
- Web协议-HTTP (6)
- ExtJS (13)
- PHP (22)
- PHP面向对象 (4)
- PHP扩展-SOAP (6)
- PHP扩展-curl (4)
- PHP与HTML(导出) (5)
- PHP扩展-综合 (7)
- mysql基础应用 (18)
- 技术心情 (18)
- 算法和面试题 (17)
- 工具(开发)使用 (36)
- memcached原理 (2)
- session和cookie (4)
- UML (2)
- Web前端_FusionCharts (5)
- Web前端_Flex (4)
- Web前端_JSP (3)
- JavaSE (10)
- JavaEE (4)
- tomcat (2)
- Servlet开发 (3)
- Spring开发 (1)
- REST相关 (2)
- 大访问量、高并发 (2)
- 网络编程 (1)
- YII (21)
- linux命令和内核 (12)
- yii与数据库 (10)
- yii与表单 (12)
- yii view层 (1)
- perl (7)
- yii扩展 (7)
- shell (4)
- photoshop (7)
- 视觉设计 (2)
- 我关注的名人在路上 (4)
- 1-自学能力 (1)
- 2-人际沟通能力 (3)
- 3-职业规划能力 (7)
- 4-项目管理能力 (2)
- python (3)
- django (4)
- Mysql高级应用 (6)
- prototype.js (4)
- Web系统安全 (1)
- Web前端-mobile (2)
- egret (6)
- jQuery源码分析 (5)
- fis (4)
最新评论
-
yzq21056563:
感谢作者分享~请教下,http://www.lisa33xia ...
CSS基础:text-overflow:ellipsis溢出文本 -
u012206458:
$.ajax的error,complete,success方法 -
DEMONU:
谢谢,虽然不能给你赞助,但是要给你顶
mysql中key 、primary key 、unique key 与index区别 -
njupt_tolmes:
阿凡达阿凡达阿凡达阿凡达阿凡达阿凡达阿凡达阿凡达阿凡达阿滕庆亚 ...
CSS基础:text-overflow:ellipsis溢出文本 -
zenmshuo:
用过SpreadJS,也包含数据可视化的图表
推荐几个web中常用js图表插件
一、前端js代码
二、后端php代码
三、数据库PDO
四、companyName_get_data方法
如果您觉得本文的内容对您的学习有所帮助,您可以微信:
// JavaScript Document Ra.ServerFailsInfo.bydepart = function(grid_id,level,department,product,service){ /******************** 公共 ************************/ var store = { 'department' : new Ext.data.JsonStore({ url: 'api/list_k.php?action=department', fields: ['name']}), 'product' : new Ext.data.JsonStore({ url: 'api/list_k.php?action=product', fields: ['name']}), 'service' : new Ext.data.JsonStore({ url: 'api/list_k.php?action=service', fields: ['name']}) }; // 从服务器获取查询结果 // 先设置jsonStore,然后load var jsonStore = new Ext.data.JsonStore({ url: 'api/fail_parts_bydepart.php', listeners:{ 'loadexception' : function(e){ alert(e.toString()); } }, fields: [ {name: 'name'}, {name: 'flash'}, {name: 'percent'} ] }); //仅执行一次(打开时tab时默认) jsonStore.load({params:{ 'level' : 'all', 'department' : department, 'product': product, 'service': service }}); // 定义一个对象,用于向服务器端传值 var paras = {}; paras.view_level = '公司级别'; // 表体 —— tbar var tbar_depart = new Ext.Toolbar({ items :[{ xtype: 'tbtext', text : "查看级别:" },'-', new Ext.form.ComboBox({ id : 'failparts-view_level', store: ['公司级别','部门级别','产品线级别','子分类级别'], allowBlank:false, triggerAction: 'all', width :100, displayValue :'部门级别', value :'部门级别', name : 'view_level', listeners : { 'select' : function(obj, data, index){ // obj是combobox对象,data是用户选择的值,index是索引(0,1,2...) vlevel = data.data.text;// 用户选择的值,此处为何是text,而不是name? paras.view_level = data.data.text; Ext.getCmp('failparts-form-department').clearValue();//通过id得到一个Component对象 paras.department = ''; // 部门 Ext.getCmp('failparts-form-product').clearValue(); paras.product = ''; // 产品线 Ext.getCmp('failparts-form-service').clearValue(); paras.service = ''; // 子分类 switch(vlevel){ case '公司级别': Ext.getCmp('failparts-form-department').setVisible(false); Ext.getCmp('failparts-form-product').setVisible(false); Ext.getCmp('failparts-form-service').setVisible(false); break; case '部门级别': Ext.getCmp('failparts-form-department').setVisible(true); Ext.getCmp('failparts-form-product').setVisible(false); Ext.getCmp('failparts-form-service').setVisible(false); break; case '产品线级别': Ext.getCmp('failparts-form-department').setVisible(true); Ext.getCmp('failparts-form-product').setVisible(true); Ext.getCmp('failparts-form-service').setVisible(false); break; case '子分类级别': Ext.getCmp('failparts-form-department').setVisible(true); Ext.getCmp('failparts-form-product').setVisible(true); Ext.getCmp('failparts-form-service').setVisible(true); break; default: Ext.getCmp('failparts-form-department').setVisible(true); } } } }),'-', new Ext.form.ComboBox({ id : 'failparts-form-department', allowBlank:false, store: store['department'], // 引用store displayField:'name', triggerAction: 'all', hidden : true, emptyText:'请选择部门', width :110, name : 'department', listeners : { 'select' : function(obj, data, index){ paras.department = data.data.name; //此处为何是name,而不是text? if(paras.view_level == '产品线级别' ||paras.view_level == '子分类级别'){ store.product.baseParams = {'department' : encodeURIComponent(data.data.name)}; store.product.load(); Ext.getCmp('failparts-form-product').clearValue(); Ext.getCmp('failparts-form-product').setVisible(true); } } } }), new Ext.form.ComboBox({ id : 'failparts-form-product', store: store.product, // 引用store displayField:'name', hidden : true, width : 120, emptyText:'请选择产品线', triggerAction: 'all', name : 'product', listeners : { 'select' : function(obj, data, index){ paras.product = data.data.name; if(paras.view_level == '子分类级别'){ store.service.baseParams = { //把字符串作为 URI 组件进行编码 'product' : encodeURIComponent(data.data.name), 'department' : paras.department }; store.service.load(); Ext.getCmp('failparts-form-service').clearValue(); Ext.getCmp('failparts-form-service').setVisible(true); } } } }), new Ext.form.ComboBox({ id : 'failparts-form-service', store: store.service, // 引用store displayField:'name', hidden : true, emptyText:'请选择子分类', width : 200, triggerAction: 'all', name : 'service', listeners : { 'select' : function(obj, data, index){ paras.service = data.data.name; } } }), { iconCls : 'search', text : '<b>更新内容</b>', handler : function() { switch(paras.view_level) { case '公司级别': var level = 'all'; break; case '部门级别': var level = 'department'; break; case '产品线级别': var level = 'product'; break; case '子分类级别': var level = 'service'; break; default: break; } if ( level == 'department' && paras.department == '' ) { Ext.Msg.alert('友情提示','请选择要查询的部门!'); return; } if ( level == 'product' && (paras.department == '' || paras.product == '') ) { Ext.Msg.alert('友情提示','请选择要查询的部门-产品线!'); return; } if ( level == 'service' && (paras.department == '' || paras.product == '' || paras.service == '' ) ) { Ext.Msg.alert('友情提示','请选择要查询的部门-产品线-子分类!'); return; } // 获取选择的值 //Ext.Msg.alert(level,paras.department + ', ' + paras.product + ', ' + paras.service); jsonStore.load({params:{ 'level' : level, 'department' : paras.department, 'product': paras.product, 'service': paras.service }}); } },'->', Baidu.Ra.Excel(grid_id) ] }); // 表格面板的列模型 var cm = new Ext.grid.ColumnModel([ {header:'机型',dataIndex:'model',width:100,sortable:true} ,{header:'部件类型',dataIndex:'parts_type',width:100,sortable:true} ,{header:'部件总数量',dataIndex:'total',width:100,sortable:true} ,{header:'故障数量',dataIndex:'num',width:100,sortable:true} ,{header:'故障率',dataIndex:'percent',width:100,sortable:true} ]); // 表格面板。也有Ext.FormPanel var panel = new Ext.grid.GridPanel({ baseCls: 'x-plain', id:grid_id, title:'按部门统计', closable:true, cm:cm, store:jsonStore, loadMask: { msg: '数据获取中,请稍候...' }, tbar:tbar_depart, region:'center' }); CompanyName.Ra.tabCon.add(panel); CompanyName.Ra.tabCon.activate(panel); }
二、后端php代码
require "CompanyName/Rss/Common/config.inc"; require "CompanyName/Util/util.inc"; require "CompanyName/Rss/Module/db.inc"; require "CompanyName/Rss/Control/func.inc"; $idc = urldecode(companyName_get_data(B_REQUEST, 'idc')); $dep = urldecode(companyName_get_data(B_REQUEST, 'department')); $finance= urldecode(companyName_get_data(B_REQUEST, 'finance')); $product= urldecode(companyName_get_data(B_REQUEST, 'product')); $action = urldecode(companyName_get_data(B_REQUEST, 'action')); $iden = urldecode(companyName_get_data(B_REQUEST, 'iden')); $suffix = date("Ym", time()); $table = "service_list"; switch($action){ case 'service' : $sql = "select distinct service as name from $table where department='$dep'"; if($product != '[全部]'){ $sql .= " and product='$product'"; } break; case 'product' : $sql = "select distinct product as name from $table where 1"; if($dep != '[全部]'){ $sql .= " and department='$dep'"; } break; case 'getflag': break; default: $sql = "select distinct department as name from $table"; } $sth = $pdo->prepare($sql); $sth->execute(); $result = $sth->fetchAll(PDO::FETCH_ASSOC); print json_encode($result);
三、数据库PDO
//在另一个config.php文件中,用define(key, value);方式设置用户名密码等。 $dsn = sprintf("mysql:host=%s;dbname=%s;port=%d;charset=%s", DB_HOST, DB_NAME, DB_PORT, DB_CHARSET); try{ $pdo = new PDO($dsn, DB_USER, DB_PASSWORD); $pdo->query("set names " . DB_CHARSET); }catch(PDOException $e){ error_log($e->getMessage()); } $dsn = sprintf("mysql:host=%s;dbname=%s;port=%d;charset=%s", DB_HOST_BUDGET, DB_NAME_BUDGET, DB_PORT, DB_CHARSET); try{ $pdo_budget = new PDO($dsn, DB_USER, DB_PASSWORD); $pdo_budget->query("set names " . DB_CHARSET); }catch(PDOException $e){ error_log($e->getMessage()); }
四、companyName_get_data方法
define('B_GET', 0); define('B_POST', 1); define('B_REQUEST',2); define('B_COOKIE', 3); function companyName_get_data($method=B_REQUEST, $name, $filter="B_RAW"){ switch($method){ case B_GET: $ret = isset($_GET[$name])? $_GET[$name] : NULL; break; case B_POST: $ret = isset($_POST[$name])? $_POST[$name] : NULL; break; case B_REQUEST: $ret = isset($_REQUEST[$name])? $_REQUEST[$name] : NULL; break; case B_COOKIE: $ret = isset($_COOKIE[$name])? $_COOKIE[$name] : NULL; break; default: $ret = NULL; break; } return $ret; } /* bool redirect_and_exit($url) * this function alone for the reason to handle of done url * @para : the full url (scheme :// host / path / script ? query # anchor); */ function redirect_and_exit($url){ header("Location:$url"); exit(); }
如果您觉得本文的内容对您的学习有所帮助,您可以微信:
发表评论
-
ExtJS ajax request 设置超时时间
2012-05-03 23:32 10073作者:zccst 查了一下资料,设置超时时间有好几种情况 ... -
ExtJS之GridPanel细分功能
2012-01-30 18:45 985zccst整理 二、 一、将结果分组展示 表格数据分组: ... -
ExtJS之EditorGridPanel
2011-12-28 18:01 7229作者:zccst 之前大多用Ext.grid.GridPan ... -
ExtJS正确的学习方式
2011-12-28 15:53 1274ExtJS与其他的技术稍微不同的是需要查手册,而不是从网上搜。 ... -
ExtJS之Store
2011-11-09 18:17 20072据目前所知:Store至少分为两类,一个是SimpleStor ... -
ExtJS表单之下拉树
2011-11-09 12:03 5574ExtJS表单之下拉树 作者:zccst 一、数据源 ... -
ExtJS表单之一个实例
2011-11-08 14:32 5385作者:zccst 一个实例, ... -
ExtJS表单之复选框CheckboxGroup展示与取值
2011-11-08 14:23 54023版本一 复选框的值都是 ... -
ExtJS之xtype的意义
2011-11-02 14:21 1619xtype:在EXTJS的可视化组件部署中的一种机制,即通过指 ... -
ExtJS面板
2011-11-02 12:13 1428面板的定义与多种面板的区别 一、Panel var panel ... -
Ext中的get、getDom、getCmp、getBody、getDoc的区别
2011-11-02 11:48 1021Ext中的get、getDom、getCmp、getBody、 ... -
ExtJS开发环境搭建
2011-06-20 14:38 1342需要注意的事项: 1,引入extjs不是引入ext-base ...
相关推荐
很多网友在问,Extjs4.0 ComboBox如何实现,好在之前用3.x实现过一个三级联动,如今用Extjs4.0来实现同样的联动效果。其中注意的一点就是,3.x中的model:’local’在Extjs4.0中用queryMode: ‘local’来表示,而且在...
在这个特定的项目“Extjs4---combobox省市区三级联动+struts2”中,我们将探讨如何利用ExtJS 4的ComboBox组件实现省市区的三级联动效果,并结合Struts2框架进行数据交互。 首先,`ComboBox`是ExtJS中的一个组件,它...
在本文中,我们将深入探讨如何使用ExtJS 4和Struts2框架实现省市区三级联动的完整示例。这个示例适用于需要在Web应用程序中实现地理区域选择功能的情况,例如用户地址输入。以下是对该技术栈及其实现方法的详细说明...
最近小弟做了Extjs实现实现下拉框联动的效果,参考了好久才学会,闲下来发一个简单的例子。。呵呵
下面我们将详细讨论如何在ExtJS中实现Combobox的二级联动。 一、基础概念 1. Combobox:ExtJS中的Combobox是FormPanel的一个字段,它结合了文本输入框和下拉列表,提供了一种选择或输入数据的方式。 2. 二级联动:...
其中,JSP(JavaServer Pages)页面中的下拉框三级联动功能,是一种常见的需求,用于处理多级分类数据的选择,如国家-省份-城市的选择。本文将深入解析如何在JSP页面中实现下拉框的三级联动功能,以及其背后的实现...
NULL 博文链接:https://ruohanfly.iteye.com/blog/2183068
一共3个文件: ...getData.asp data.mdb 前台采用ExtJs 2.2.1编写(由于库文件比较大,考虑到大家本机都有了,所以在此没有上传,大家直接改一下路径即可),后台采用asp+access...本例子演示的4级联动菜单:州+国家+城市+地区
在ExtJS5中,树形菜单(Tree Menu)是一种常见的UI组件,它允许用户以层次结构的方式展示数据,非常适合用于目录浏览、文件系统导航或者复杂的组织结构展示。在本篇文章中,我们将深入探讨ExtJS5树形菜单的使用方法...
本文将深入探讨如何在ExtJS中实现ComboBox的二级联动。 首先,我们需要理解ExtJS中的ComboBox基本结构。ComboBox由几个关键部分组成,包括store(数据存储)、displayField(显示字段)和valueField(值字段)。...
动态加载菜单是ExtJS中的一个关键特性,它允许在用户交互过程中动态地创建、修改和加载菜单项,提供了更灵活的用户界面设计。在“Extjs动态加载菜单”这个主题中,我们将深入探讨这一功能的实现方式以及相关技术。 ...
它提供了在Visual Studio 2010环境下,使用ASP.NET、jQuery和ExtJS三种不同JavaScript框架实现省市区三级联动的DropDownList控件,并通过Ajax技术进行异步数据加载的示例。 首先,ASP.NET是Microsoft提供的一个强大...
EXTJS4的菜单栏设计灵活,可自定义程度高,支持多级菜单、图标、分隔符等元素,为开发者提供了丰富的API和配置选项。 菜单栏在EXTJS4中的实现主要基于`Ext.menu.Menu`类。这个类提供了一个容器,可以容纳多个菜单项...
总结来说,ExtJS 4.2 Desktop 拓展是一个集成了多种桌面特性并优化了基础框架的解决方案,它提供了图标换行、窗口拖动、多级开始菜单等功能,使得开发复杂的Web应用变得更加简单和直观。通过下载提供的LinBDesk4.2...
本文将深入探讨如何使用ExtJS 3结合MySQL来实现一个省份城市二级联动的前端与后台系统。 首先,ExtJS 3提供了丰富的组件和API,使得开发者可以轻松创建各种复杂的用户界面,如下拉菜单、表格、表单等。在这个案例中...
这篇博客文章“extjs4 导航菜单实例”将深入探讨如何在ExtJS 4中创建和使用导航菜单,这对于构建具有层次结构和动态功能的用户界面至关重要。 在ExtJS中,导航菜单通常通过`Ext.menu.Menu`类来实现,这是一个可弹出...
2仿Extjs的左菜单,可动态绑定数据集,采用fontawesome作为图片; 3左菜单联动的中间部分的Tab控件,Tab页可关闭。 补充:该项目用vs2012运行。 准备修改积分的,原代码找不到了,麻烦管理员将这个资源删除,...