extjs中的grid中的数据加载问题!

{
header : 'psnId',
hidden:true,
dataIndex : 'psnId'
},
{
header : '部门/单位',
width:120,
align: 'left',
sortable: true,
//dataIndex : 1=='DEP_001'?'psnDeptName':'psnOrgName'
}

基本代码如上,怎样才能在不同的情况下,一种情况显示部门名称,一种情况显示机构名称。求大神指点一下!!!

1个回答

renderer根据当前行其他值返回对应的数据
http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.grid.column.Column-cfg-renderer

 renderer : Function/String
A renderer is an 'interceptor' method which can be used to transform data (value, appearance, etc.) before it is rendered. Example:

{
    renderer: function(value){
        if (value === 1) {
            return '1 person';
        }
        return value + ' people';
    }
}
Additionally a string naming an Ext.util.Format method can be passed:

{
    renderer: 'uppercase'
}
Defaults to: false

Available since: 3.4.0

value : Object
The data value for the current cell
metaData : Object
A collection of metadata about the current cell; can be used or modified by the renderer. Recognized properties are: tdCls, tdAttr, and style.
record : Ext.data.Model
The record for the current row
rowIndex : Number
The index of the current row
colIndex : Number
The index of the current column
store : Ext.data.Store
The data store
view : Ext.view.View
The current view
return : String
The HTML string to be rendered.
showbo
支付宝加好友偷能量挖 回复lm121342074: 记得采纳:)
2 年多之前 回复
lm121342074
lm121342074 就是这个,谢谢!
2 年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
extjs grid 加载查询的结果
当页面第一次加载的时候grid里面可以显示所有数据, grid查询时弹出一个表单,当我在表单中输入了查询条件提交以后,grid中怎么显示新的查询数据 啊
extjs的grid渲染数据出现空白段
有个grid需要加载一百多条数据,但是显示的时候,数据总条数和数据都是正确的,但是向下滑动滚动条,每隔47行就会出现一段空白,向下滑过空白段之后,再向上滑动滚动条时,空白段又会出现在36行。。。网上搜不到资料,有没有人遇到过相同的问题?或者能给我一些提示的?在线等,谢谢! ![图片说明](https://img-ask.csdn.net/upload/201611/14/1479104443_960218.png) 补充代码: //grid定义 xtype: 'grid', id:'thirdPartyOrderListGrid', width: '100%', height: 415, viewConfig:{ enableTextSelection : true, getRowClass:function(record, index, rowParams, store){ return record.get('flag')=='1'?"child-row":""; } }, listeners:{ itemdblclick:function(dataview,record, item, index, e){ var win = Ext.widget("thirdPartyOrderHandEditWin"); win.down("form").loadRecord(record); win.show(); } }, autoRender:true, columnLines: true, loadMask: true, //读取数据时的遮罩和提示功能即加载loding... resizable: true, forceFit: false, collapsible:false, titleCollapse:false, selModel : new Ext.selection.CheckboxModel(), plugins:[ Ext.create('Ext.grid.plugin.CellEditing',{ clicksToEdit:2 //设置单击单元格双击编辑 }) ], store: Ext.create('Ext.data.Store', { fields:[{ name : 'flag' },{ name : 'errorMsg' },{ name : 'orderId' },{ name : 'skuId' },{ name : 'iid' } ··· ] }), columns : { items:[ { text:'序号',xtype: 'rownumberer',width: 50}, { text: 'flag',dataIndex: 'flag',width: 150,align: 'center',hidden:true}, { text: '错误信息',dataIndex: 'errorMsg',width: 150,align: 'center', renderer: function(value, meta, record) {//超长自动换行 meta.style = 'overflow:auto;padding: 3px 6px;text-overflow: ellipsis;white-space: nowrap;white-space:normal;line-height:20px;'; return value; } }, { text: '订单编号',dataIndex: 'orderId',width: 150,align: 'center'}, { text: '平台商品码',dataIndex: 'skuId',width: 150,align: 'center'}, { text: '平台商品款码',dataIndex: 'iid',width: 150,align: 'center'}, ··· ], defaults: { align: 'center', sortable:false, menuDisabled : true } }, dockedItems : [{ ··· }] }] //grid的赋值 form.submit( { waitMsg : '请稍等.....', url : basePath + '···.spmvc', method : 'post', timeout:600000, params : formValues, success : function(form,action) { win.close(); result = action.result; var batchList = result.batchList; console.dir(batchList); var store = Ext.getCmp('thirdPartyOrderListGrid').store; store.add(batchList); }, failure : function(form,action) { Ext.Msg.alert('执行结果', action.result.msg); } }); 部分用省略号代替了,从代码上看不出什么问题···
ExtJS4.1 Grid读取数据复选框打钩
ExtJS4.1 需求是这样的,有个带复选框的Grid,里面固定存放20个信息数据(数据库存放一张表中),第一次编辑的时候选了3条数据保存在了另一张表中 现在想知道我在加载的时候还是显示这20个信息数据,但是也读取另一张表的3条数据,这20条信息里的三个数据前面复选框需要打上对勾,应该如何操作呢?
【extjs】Ext.data.HttpProxy的问题,关于grid加载acion返回数据(struts2)
如题,初学extjs [code="java"] var store =new Ext.data.JsonStore({ autoLoad:true, proxy:new Ext.data.HttpProxy({url:"http://localhost:8080/rbs/Login_testLogin.action"}), // data:[{"id":1,"name":"图片","typeValue":"pic"},{"id":2,"name":"视频","typeValue":"avi"}], fields:["id","name","typeValue"], }) [/code] 上面的代码中,url里的action返回的string结果就是下面注释行中data的内容 但是当我使用注释行里写死的数据的时候,grid才能加载到数据,而用proxy获取action返回数据的时候,却不行 然后是action的代码 [code="java"] List<Types> lt = service.findListByParam("from Types types"); JSONArray jsonObject = JSONArray.fromObject(lt); outputStr = jsonObject.toString(); System.out.println(outputStr); PrintWriter out = ServletActionContext.getResponse().getWriter(); getResponse().setContentType("text/javascript;charset=GBK"); out.print(outputStr); return null; [/code]
extjs gridpael 重新加载问题
我想实现这样一个功能: 有一个表单和一个grid 表单,主要是一些查询条件 grid 用来显示查询的结果, 当页面第一次加载的时候grid里面可以显示所有数据, 当我在表单中输入了查询条件提交以后,grid中显示新的数据
extjs Ext.grid.GridPanel组件使用时不显示数据
一.extjs grid 页面 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <link rel="stylesheet" type="text/css" href="<%=path %>/ext/resources/css/ext-all.css"/> <script type="text/javascript" src="<%=path %>/ext/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="<%=path %>/ext/ext-all.js"></script> <script type="text/javascript"> Ext.onReady(function(){ //handleMouseDown:Ext.emptyFn此属性去取消单击行选中复选框 singleSelect:true此属性是取消按shft多选 //创建表的列模型 var cm = new Ext.grid.ColumnModel([ {header:'编号',dataIndex:'id',sortable:true}, {header:'名称',dataIndex:'name'}, {header:'描述',dataIndex:'descn'} ]); //创建数据存储对象 var store = new Ext.data.Store({ proxy:new Ext.data.HttpProxy({url:'<%=path%>/data.jsp'}), reader:new Ext.data.JsonReader({ totalProperty:'totalProperty', root:'root' },[ {name:'id'}, {name:'name'}, {name:'descn'} ]) }); //store.load();//如果配置了Ext.PagingToolbar分页工具条 那么store.load()就要在Grid后执行 //用GrinPanel装配 var grid = new Ext.grid.GridPanel({ renderTo:'grid', //渲染范围 loadMask:true, //是否加载提示 store:store, //数据存储对象 cm:cm, //列模型 stripeRows:true, //是否隔行变色 enableColumnMove:true, //列是否可拖拽 enableColumnResize:true,//列宽是否可拖拽改变大小 autoHeight:true, width:700, viewConfig:{ columnsText:'显示的列', scrollOffset:30, sortAscText:'升序', sortDescText:'降序', forceFit:true }, bbar:new Ext.PagingToolbar({ pageSize:6, store:store, displayInfo:true, displayMsg:'显示第{0}条到{1}条记录,一共{2}条', emptyMsg:'没有记录' }) }); store.load({params:{start:1,limit:6}}); }); </script> </head> <body> <div id="grid"></div> </body> </html> 二.提供json数据页面 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> <% String start = request.getParameter("start"); String limit = request.getParameter("limit"); try { int index = Integer.parseInt(start); int pageSize = Integer.parseInt(limit); String json = "{totalProperty:100,root:["; for (int i = index; i < pageSize + index; i++) { json += "{id:" + i + ",name:name" + i + ",descn:descn" + i + "}"; if (i != pageSize + index - 1) { json += ","; } } json += "]}"; out.print(json); } catch (Exception e) { e.printStackTrace(); } %> </body> </html>
【extjs3.2】grid重新加载jsonstore后,点击grid上的分页组件,grid不刷新
页面上有个combobox,grid,grid上有个pageToolbar用于分页。页面加载时,会将json数据加载到grid和pageToolbar里。 点击分页(此时有4页数据),grid能够正常分页显示。此时选择combobox,重新查询load store,grid和pageToolbar进行更新(此时有2页数据),点击下一页grid数据[b]没有更新显示下一页数据[/b]。附核心代码: 根据combobox加载jsonstore,更新grid [code="javascript"] function reload(status){ var url = String.format(queryUri + 'status.json?status={0}',status); var comboStore = createJsonStore(fields,url); comboStore.load( { params:{start:0, limit:pageSize}, callback:function(r,options,success){ if(success == true){ var isNull = comboStore.getAt(0) == null; if(isNull){ grid.store.removeAll(); grid.getView().refresh(); }else{ grid.store = comboStore; var pageTool = grid.getBottomToolbar(); pageTool.updateInfo(); pageTool.bindStore(grid.store); var topTool = grid.getTopToolbar(); topTool.bindStore(grid.store); grid.getView().refresh(); } }else{ Ext.MessageBox.alert("查询失败"); } } } ); } [/code] [code="javascript"] function createJsonStore(fileds,url) { var jsonStore = new Ext.data.JsonStore({ fields : fileds, root : 'root', totalProperty : 'totalCount', remoteSort : true, proxy : new Ext.data.ScriptTagProxy({ url : url }) }); return jsonStore; } [/code]
extjs 一次加载数据 前台分页问题
后台拿到的json [code="js"] [['0','张三','0','15246532154'],['1','李四','0','15246532154'],['2','王五','0','15242342154'],['3','李磊','0','15245678987'],['4','卡卡','0','12321313321'],['5','阿斯达','1','12131312322'],['6','斯巴达','1','11231231231'],['7','李欧','1','23343434343']] [/code] 前台ext代码: [code="js"] /** * 前台分页 */ Ext.onReady(function() { var sm = new Ext.grid.CheckboxSelectionModel(); var cm = new Ext.grid.ColumnModel([ // 序号 new Ext.grid.RowNumberer(), sm, { header : '编号', dataIndex : 'id', sortable : true, type : 'int' }, { header : '姓名', dataIndex : 'name' }, { header : '性别' }, { header : '电话', dataIndex : 'phone' }]); var reader = new Ext.data.ArrayReader({}, [{ name : 'id' }, { name : 'name' }, { name : 'sex' }, { name : 'phone' }]); var store = new Ext.data.Store({ reader : reader }); // 读取后台传递于前台数据 Ext.Ajax.request({ url : '../test/user2.show', method : 'get', success : function(response, opts) { var obj = Ext.decode(response.responseText);// obj储存响应的数据 store.proxy = new Ext.data.PagingMemoryProxy(obj) // PagingMemoryProxy() // 一次性读取数据 }, failure : function() { Ext.Msg.alert("读取数据失败"); } }); // 分页条 var pagebar = new Ext.PagingToolbar({ pageSize : 5,// 每页显示条数 store : store, beforePageText : "当前第", afterPageText : "页,共{0}页", lastText : "尾页", nextText : "下一页", prevText : "上一页", firstText : "首页", refreshText : "刷新页面", displayInfo : true, displayMsg : "当前显示 {0} - {1}条, 共 {2}条", emptyMsg : "没有记录" }); var grid = new Ext.grid.GridPanel({ renderTo : 'grid', autoHeight : true, store : store, mode : "remote", cm : cm, sm : sm, loadMask : { msg : '正在加载数据,请稍侯……' }, tbar : pagebar }); store.load({ params : { start : 0, limit : 5 } });// 按5条记录分布 }); [/code] [code="html"] <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>前台分页</title> <link rel="stylesheet" type="text/css" href="../js/ext-3.3.1/resources/css/ext-all.css" /> <script type="text/javascript" src="../js/ext-3.3.1/ext-base.js"></script> <script type="text/javascript" src="../js/ext-3.3.1/ext-all.js"></script> <script type="text/javascript" src="../js/ext-3.3.1/ext-lang-zh_CN.js"></script> <script type="text/javascript" src="js/PagingMemoryProxy.js"></script> <script type="text/javascript" src="js/diygrid2.js"></script> </head> <body> <div id="grid" style="height:265px;"></div> </body> </html> [/code] 页面始终处于加载中,分页数据不显示。求指导。
Extjs的ItemSelector中的toStore重新加载的问题
在使用ItemSelector的时候,根据传入的参数重新加载toStore,但是加载后的toStore数据不刷新还是第一次加载的数据。具体代码如下: [code="java"] { id : 'assignResource', text : '分配资源', icon : 'images/drop-yes.gif', cls : 'x-btn-text-icon', handler : function() { var sm = grid.getSelectionModel(); var sel = sm.getSelected(); if (sm.hasSelection()) { getResourcesToStoreJsonUrl = getResourcesToStoreJsonUrl + "&resourceList=" + sel.data.id; alert(getResourcesToStoreJsonUrl); var resourceResultsStore = new Ext.data.Store({ url : getResourcesJsonUrl, reader : new Ext.data.JsonReader({ root : 'rows', // 返回结果集 pruneModifiedRecords : true, totalProperty : 'results', // 返回总条数 id : 'returnValue' // 主键 }, [{ name : 'returnValue' }, { name : 'displayText' }]) }); var resourcesToStore = new Ext.data.Store({ url : getResourcesToStoreJsonUrl, reader : new Ext.data.JsonReader({ root : 'rows', // 返回结果集 pruneModifiedRecords : true, totalProperty : 'results', // 返回总条数 id : 'returnValue' // 主键 }, [{ name : 'returnValue' }, { name : 'displayText' }]) }); // 分配资源form var itemSelect = new Ext.ux.ItemSelector( { name : "resourcesList", fieldLabel : "资源组分配", dataFields : ["returnValue", "displayText"], fromStore : resourceResultsStore, toStore : resourcesToStore, msWidth : 250, msHeight : 200, valueField : "returnValue", displayField : "displayText", imagePath : "images/", toLegend : "已分配资源", fromLegend : "现有资源", toTBar : [{ text : "清除", handler : function() { var i = assingResourceForm.getForm() .findField("itemselector"); i.reset.call(i); } }] }); resourcesToStore.reload(); resourceResultsStore.reload(); var assingResourceForm = new Ext.form.FormPanel({ url : postUrl, xtype : 'fieldset', autoHeight : true, layout : 'form', items : [itemSelect] }); var assignRWindow = new Ext.Window({ layout : 'fit', title : '<div style="text-align:center">分配资源</div>', width : 800, height : 520, closeAction : 'hide', plain : true, maximizable : true, items : new Ext.TabPanel({ region : 'center', border : false, activeTab : 0, items : [{ title : "资源分配登记", autoScroll : true, items : [assingResourceForm] }] }), buttons : [{ text : '保存', handler : function() { // 保存修改信息 if (assingResourceForm.getForm() .isValid()) { Ext.Msg .alert( '数据提交', '新分配的资源ID为以下: <br />' + (assingResourceForm .getForm() .getValues(true))); var conn = Ext.lib.Ajax .getConnectionObject().conn; conn .open( "post", assignResourcesUrl + "&" + assingResourceForm .getForm() .getValues(true), false); conn.send(null); /* * if * ((conn.responseText).indexOf('correct') == * -1) { Ext.MessageBox.alert('提示', * '输入的验证码不正确,请重新输入!'); * authImg.focus(); return false; } */ } else { Ext.MessageBox.alert('错误', '请修正页面提示的错误后提交。'); } } }, { text : '关闭', handler : function() { assignRWindow.hide(); } }], listeners : { // 保证最大化后窗口中的滚动条不出问题 close : function(w) { w.restore(); }, maximize : function(w) { w.setPosition(document.body.scrollLeft, document.body.scrollTop); } } }); assignRWindow.setPosition(0, 3); assignRWindow.show(); } else { Ext.MessageBox.alert('提示', '请选择要为其分配资料的组!').getDialog('提示') .setPosition(300, 150); } } } [/code] 有遇到过这个问题的朋友还请指点一下。 感谢!
Extjs 在修改数据的时候,加载不了数据
在线等大神! ---------- /** * 定义权限的左边store */ var permissionStore =Ext.create('Ext.data.ArrayStore', { fields: ['value','text'], proxy: { type: 'ajax', url: path + '/manage/getRoles.do', reader: 'array', actionMethods : { read: 'post' }, }, autoLoad: true, sortInfo: { field: 'value', direction: 'ASC' } }); /** * 自定义一个plane,根据allowBlank显示是否有'*' */ Ext.define('editFormPanel', { extend: 'BasicFormPanel', initComponent: function() { this.on('beforeadd', function(me, field){ if(field.xtype == "fieldset") { for(var key in field.items.items) { if (!field.items.items[key].allowBlank) { field.items.items[key].labelSeparator += required; } } } else { if (!field.allowBlank) { // 处理textfield field.labelSeparator += required; } } }); this.callParent(arguments); } }); /** * 定义编辑用户页面显示模型 */ Ext.define('editUserForm', { extend: 'editFormPanel', url: path + '/manage/saveUser.do', buttonAlign: 'right', reader: { type: 'json', root: 'user' }, defaults: { labelWidth: 120, allowBlank: false }, defaultType: 'textfield', items: [{ xtype:'fieldset', title: '基本信息<span style="color:red">*<span>', defaultType: 'textfield', layout: 'anchor', defaults: { allowBlank: false, anchor: '100%' }, items:[{ fieldLabel: '用户名', name: 'loginName', id: 'userName', blankText: '用户名不能为空', regex:/^[\u4e00-\u9fa5_a-zA-Z0-9_]{5,20}$/, regexText: '用户名需以字母开头,只能为中文,英文字母和数字及_组成(长度5-20位)!', listeners: { blur: function(field){ availableName(field); } } }/*,{ fieldLabel : 'id' , xtype : 'hidden', name : 'user.id', value: 'user.id', id:'id' }*/] },/*{ xtype:'fieldset', title: '扩展信息', defaultType: 'textfield', layout: 'anchor', defaults: { anchor: '100%' }, items:[{ fieldLabel: '固定电话', id: 'fixed', name: 'user.fixedTelephone', value: '', regex: /^(\d{3,4}-)?\d{7,8}$/, regexText: '不是有效的固定电话,固定电话格式为:"XXX-XXXXXXX"或"XXXXXXXX"' },{ fieldLabel: '移动电话', id: 'mobile', name: 'user.mobileTelephone', value: '', regex: /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/, regexText: '不是有效的移动电话' },{ fieldLabel: '邮件地址', id: 'email', name: 'user.mail', value: '', vtype: 'email', vtypeText: '不是有效的mail地址' }, { fieldLabel: '描述', id:'description', name: 'user.description', value: '', xtype: 'textareafield' }] }*/,{ xtype:'fieldset', title: '权限', defaultType: 'textfield', layout: 'anchor', defaults: { anchor: '100%' }, items:[{ xtype: 'itemselector', name: 'roleIdStr', id: 'itemselector-field', anchor: '100%', fieldLabel: '用户角色', imagePath: '../ux/images/', store: permissionStore, displayField: 'text', valueField: 'value', value: [], allowBlank: true, msgTarget: 'side', fromTitle: '角色列表', toTitle: '已选择', resetText: 'Reset' }] } ] }); /** * 验证用户名是否符合相应的格式及是否已经存在 */ function availableName(field) { var value = field.value; var result = false; if("" != value && (/^[\u4e00-\u9fa5_a-zA-Z0-9_]{5,20}$/.test(value))) { Ext.Ajax.request({ params:{'user.loginName':value}, method:"POST", async: false, url:path + '/manage/checkNameExists.do', success:function(response){ var responseArray = Ext.JSON.decode(response.responseText); if(responseArray.isExists){ field.markInvalid("该用户名已经被占用!"); } else { result = true; } } }); } else { field.next().validate(); } return result; }; ---------- /** * 在编辑用户表单里面新加保存提交按钮生成编辑用户页面 */ Ext.define('editUser', { extend: 'editUserForm', buttons: [ { text: '保&nbsp;存', handler: function() { // 如果通过验证,手动调用ajax再次验证 var form = this.up('form').getForm(); if(form.isValid()) { var userField = Ext.getCmp('userName'); var result = availableName(userField); if(result) { form.submit({ success: function(form, action) { editUserWindow.close(); // 移除查询条件 searchCondition = {status:'ACTIVE'}; userStore.loadPage(1); }, failure: function(form, actoin) { showDefaultErrorMsg('错误', '数据异常,请确认后重新提交!'); } }); } } } } ] }); ---------- var editForm = Ext.create('editUser'); /** * 编辑用户窗口 */ var editUserWindow = function(){ editUserWindow = Ext.create('Ext.window.Window', { title: '编辑用户', width: 500, height: 480, constrain:true, // 将拖动范围限制在容器内 resizable: false, modal:true, layout: 'fit', items: editForm }); editUserWindow.show(); }; /** * 编辑/查看用户 */ var editUserBtn = Ext.create('Ext.button.Button', { text: '编辑用户', disabled: false, scope: this, iconCls:'edit', handler: function() { var id = selectBox(Ext.getCmp("grid")); if(null != id) { if(id.length > 1) { showDefaultMsg("提示", "只能同时编辑一个用户!"); } else { editForm.form.load({ url:path + '/manage/getUserById.do', params: {id: id}, success : function(form,action) { editUserWindow(); showDefaultMsg("提示", "载入用户信息成功!"); }, failure : function(form,action) { console.log(action); console.log(form); //showDefaultMsg("提示", action.result.info); } }); } } } });
Extjs中store问题,通过id,从后台查数据存入store中,并在panel中显示
//创建model Ext.regModel('rukuInfos',{ fields:[{name:'id'},{name: 'rukuRemark'},{name:'rukuAcount'},{name:'rukuDateTime'},{name:'rukuId'}] }); //有问题的方法 function showruku(){ var rukustore = Ext.create('Ext.data.Store', { pageSize: 6, //分页大小 model: 'rukuInfos', proxy: { pageParam:'pageNo', type: 'ajax', method: 'POST', url: 'http://localhost:8000/medicine/ProductAction_queryRukuInfo.action' ,//请求的地址 reader: { root: 'rukuInfos', totalProperty: 'rowCount' } } });// var rukuGrid = Ext.create('Ext.grid.Panel', { title: '药品入库信息列表', width: 520, height:230, id:'rukuGrid', store: rukustore, region: 'center', loadMask: true, //加载提示{ msg: '正在加载数据,请稍侯……' } columns: [//配置表格列 Ext.create('Ext.grid.RowNumberer', {text : '行号', width : 40}), {header: "入库编号", width: 160, dataIndex: 'rukuId'}, {header: "入库时间", width: 100, dataIndex: 'rukuDateTime' , xtype : 'datecolumn',//Ext.grid.column.Date日期列 format : 'Y-m-d'//日期格式化字符串 }, {header: "入库数量", width: 100, dataIndex: 'rukuAcount', xtype: 'numbercolumn', format:'000.0' }, {header: "入库备注", width: 120, dataIndex: 'rukuRemark'} ], dockedItems: [ { xtype: 'pagingtoolbar', store: rukustore, // same store GridPanel is using dock: 'bottom', //分页的位置 emptyMsg: '没有数据', displayInfo: true, displayMsg: '当前显示{0}-{1}条记录 / 共{2}条记录 ', beforePagetext: '第', afterPagetext: '页/共{0}页' }] }); //初始加载第1页 rukustore.loadPage(1); var winruku= new Ext.window.Window({ layout:'fit', width:535, resizable : false, shadow : true, modal :true, plain: true, disabled : false, closable:true, items:rukuGrid }); var proList = getProductIdList(); var num = proList.length; if(num > 1){ Ext.MessageBox.alert("提示","每次只能查看一条药品的入库信息。"); }else if(num == 1){ winruku.setTitle("显示该药品入库信息"); winruku.show(); var id = proList[0]; alert(id); //从后台加载数据 Ext.Ajax.request({//如果报length为空,一般要新建一个model来弄 url : 'http://localhost:8000/medicine/ProductAction_queryRukuInfo.action' , method : 'get', params : {proid:id}, jsonData : { proid:id }, success : function(response) { var data = Ext.JSON.decode(response.responseText).rukuInfos; var json = eval("(" + response.responseText + ")"); rukucunstore = new Ext.data.Store( { model : 'rukuInfos', proxy : { pageParam:'pageNo', type : 'memory', reader : { type : 'json', root:'rukuInfos'//注意mode1的值一定要与后台的一致 } } }); rukucunstore.load(data); Model = rukucunstore.Model; alert(rukucunstore.data); } }); } //取得所选药品id function getProductIdList(){ var recs = proGrid.getSelectionModel().getSelection(); var list = []; if(recs.length == 0){ Ext.MessageBox.alert('提示','请选择要进行操作的药品!'); }else{ for(var i = 0 ; i < recs.length ; i++){ var rec = recs[i]; list.push(rec.get('id')); } } return list; }
关于Extjs中悬浮框位置设置的问题。
最近在做关于Extjs的实习项目,里面涉及到 的设置,小队头头要求我把悬浮框显示的位置刚好以鼠标作为左上角,对于这个我不知道悬浮框组件中是否有对位置动态捕捉的设定。希望大家能够帮助我答疑解惑。 ``` Ext.define('query.controller.PayListInfoCheckController', { extend : 'Ext.app.Controller', views : [ 'PayListInfoCheckView' ], stores : [ 'PayListInfoCheckStore' ], init : function() { this.control({ 'paylistinfocheckview' : { afterrender : this.afterRender }, 'paylistinfocheckview button[action=search]' : { click : this.onSearchBtn } }); }, afterRender : function(tab) { var grid = tab.down('grid'); var store = grid.getStore(); store.load(); var view = grid.getView(); var tip = Ext.create('Ext.tip.ToolTip', { target : view.el, mouseOffset : [ -50, -20 ], delegate : view.cellSelector, trackMouse : false, frame : true, layout : 'fit', showDelay : 0, dismissDelay : 0, autoHide : false, items : [ { xtype : 'form' } ], listeners : { beforeshow : function(tip, eOptes) { var jsDom = tip.triggerElement; var detailType = jsDom.getAttribute('detailType'); var paramsStr = jsDom.getAttribute('paramsArr') if (!detailType || !paramsStr) { return false; } var title = jsDom.getAttribute('paramsTitle'); var titleArr = null; if(title){ titleArr = title.split(','); } var paramsArr = paramsStr.split(','); var record = view.getRecord(view .findItemByChild(tip.triggerElement)); var form = tip.down('form'); var map = {}; var titleMap = {}; Ext.suspendLayouts(); form.removeAll(); paramsArr.forEach(function(value, index) { var val = record.get(value); if (!Ext.isEmpty(val)) { map[value] = val; form.add({ xtype : 'displayfield', name : value }); if(titleArr){ titleMap[value] = titleArr[index]; } } }); if (Ext.Object.isEmpty(map)) { Ext.resumeLayouts(true); return false; } if(titleArr){ Ext.Object.each(map, function(key, value){ map[key] = titleMap[key] + ":" + value }); } switch (detailType) { case 'orderId': form.maxWidth = 150; break; case 'transTime': form.maxWidth = 200; break; case 'payCustName': form.maxWidth = 200; //form.maxHeight=300 break; case 'payCustCardNo': form.maxWidth = 200; //form.maxHeight=900 break; } form.getForm().setValues(map); Ext.resumeLayouts(true); } } }); }, // tabAfterRender: function (tab) { // var me = this; // Ext.Ajax.request( // { // url: 'query/view/list', // success: function (response) { // var obj = Ext.decode(response.responseText); // if (obj.success) { // var data = obj.data; // var combo = tab.down('extendcombo[name=orderType]'); // combo.setDefaultValue(data.id, function () { // // 在获取到当前用户开之后才加载数据 // me.searchButtonClick(tab.down('button[text=查询]')); // }); // } // } // }); // }, onSearchBtn : function(btn) { var tab = btn.up('paylistinfocheckview'); var form = tab.down('form'); var store = tab.down('grid').getStore(); var map = form.getForm().getValues(); // 额外加上排序 map.orderBy = true; store.getProxy().extraParams = map; store.loadPage(1); } // searchBtnClicked: function (btn) { // var tab = btn.up('paylistinfocheckview').down('grid'), // store = tab.getStore(); // var tab1=btn.up('paylistinfocheckview'); // var orderId = tab1.down('textfield[name=orderId]').getValue(); // var userId = tab1.down('textfield[name=userId]').getValue(); // var customerId = tab1.down('textfield[name=customerId]').getValue(); // store.loadPage(1, { // params: { // orderId: orderId, // userId: userId, // customerId: customerId // }, // callback: function (records, operation, success) { // if (!success) { // Ext.MessageBox.alert('内部错误'); // } // } // }); // } }); ``` 这是我对界面的controller代码,![图片说明](https://img-ask.csdn.net/upload/201505/26/1432604890_540443.png),这是悬浮框。这个界面并不是完善后的。
extjs grid 怎么改变行的颜色?
在数据加载完后,根据值改变行颜色,不要viewconfig 那个只有初始化才用的。
后台无法获取Extjs中formPanel中的数据,请问如何解决。
被Extjs震撼了。想在下一个项目上应用。废话少说,说问题: 关键性代码如下 [code="java"] var grid = new Ext.grid.GridPanel({ el : "_grid", ds : ds, cm : cm, sm : sm, iconCls : 'icon-grid', width : 525, // height:50, // autoScroll:true, autoHeight : true, frame : true, title : 'HelloWorld', autoHeight : true, // draggable:true, bbar : pagingBar, tbar : [{ text : "新增", handler : function() { var _window = new Ext.Window({ title : "新增用户", width : 350, height : 220, // frame:true, items : [{ xtype : "form", id : "formpanel", style : "padding:20px,5px,40px,60px", baseCls : "x-plain", labelWidth : 40, items : [{ xtype : "textfield", name : "username", id : "username", fieldLabel : "姓名", allowBlank : false }, { xtype : "textfield", inputType : "password", name : "password", allowBlank : false, fieldLabel : "密码" }] }], buttons : [{ text : '提交', handler : function() { var formpanel1 = _window.findById("formpanel") if (formpanel1.form.isValid()) { this.disabled = true; flag = false; formpanel1.getForm().submit({ url : 'hworld/hello!Save.action',//提交给后台。后台相应save方法。此处成功调用了该方法 method : 'post', waitTitle : '请稍等……', waitMsg : '正在上传数据……', success : function() { Ext.Msg.alert("成功", "操作成功!"); this.disabled = false; ds.load({ params : { start : 0, limit : 10 } }); }, failure : function() { Ext.Msg.alert("出错啦", "数据保存失败!"); this.disabled = false; } }); _window.close(); } } }, { text : '重置', handler : function() { _window.findById("formpanel").form.reset(); } }] }); _window.show(); } }, "-", { text : "删除", iconCls : 'remove', handler : function() { var sel = grid.getSelectionModel().getCount(); var ids = ""; if (sel > 0) { Ext.MessageBox.confirm("请确认", "是否确定删除", function(button, text) { if (button == "yes") { for (var i = 0; i < 20; i++) { if (grid.getSelectionModel() .isSelected(i)) { id = grid.store.getAt(i).get("id"); ids = ids + id + "," } } testdaoimp.delSelected(ids, callbackdel); function callbackdel(_data) { if (_data) { ds.load({ params : { start : 0, limit : 10 } }); Ext.MessageBox .alert("提示:", "成功删除!"); } } } }) } else { Ext.MessageBox.alert("提示:", "请选择"); } } }], loadMask : { msg : "数据加载中,请稍等..." } }); [/code] 后台采用struts2来做。 如下:[code="java"] public class HelloWorld extends ActionSupport { private String username; private String password; TestDao test=new TestDaoImp(); public void Save() { Iuser p=new Iuser(); p.setUsername(username);//[color=red]得到formPanel里的username的值,但是显示为null.[/color] p.setPassword(password);//[color=red]得到formPanel里的password的值,但是显示为null.[/color] test.savePerson(p); } public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } }[/code] 请问如何解决?我用了url中带参数肯定是可以,但是不想用这种蠢办法。还是比较推崇struts2的那种自动获取页面数据的办法。
Help!!! Struts2+ExtJs action返回结果输出到其他页面的问题
想要实现的是获取action返回后跳转到另外的页面(struts.xml控制),并把数据用GridPane输出.也就是用gridpanel替换掉"<s:iterator>"标签的作用. 例如 getUser.jsp->submit->searchuser.action->(json string)userlist->userlist.jsp(gridpanel显示). 请问,ExtJs是AJAX 实现的话,[color=red]action是否一定是将数据返回到提交页面的?[/color]例如 getUser.jsp->searchuser.action->getUser.jsp. 如果是,那应该怎样将数据转移给我想要跳转的页面(userlist.jsp)? 下面是我做的一个例子,跳转到userlist.jsp后GridPanel[color=red]只看到Grid而没有数据[/color],初学ExtJs,请各位多多指教!! getUser.jsp(action="searchuser")用于提交用户ID,略过. struts.xml [code="xml"] <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN" "http://struts.apache.org/dtds/struts-2.0.dtd"> <struts> <package name="prodinfo" extends="struts-default"> <action name="searchuser" class="userAction" method="searchUser"> <result name="success">/userlist.jsp</result> </action> </package> </struts> [/code] 响应searchuser.action的class:userAction [code="java"] package com.prodinfo.action; import java.util.Map; import java.util.List; import com.opensymphony.xwork2.ActionContext; import com.opensymphony.xwork2.ActionSupport; import java.util.Collection; import com.prodinfo.biz.*; import com.prodinfo.common.*; import com.prodinfo.dao.*; import com.prodinfo.pojo.Logger; import com.prodinfo.pojo.SysUsr; import net.sf.json.JSONArray; import net.sf.json.JSONObject; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.struts2.ServletActionContext; public class UserAction extends ActionSupport { private String userid; private String password; private String username; private String usrpwdques; private String usrpwdans; private String usremail; private ILoggerDao loggerdao; private IUserOperation uo; private ComDate comdate; private ComSession ssn; private SysUsr sysusr; public String userlist; public UserAction() { comdate = new ComDate(); ssn = new ComSession(); } public String getUserid() { return userid; } public void setUserid(String userid) { this.userid = userid; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public String getUsrpwdques() { return usrpwdques; } public void setUsrpwdques(String usrpwdques) { this.usrpwdques = usrpwdques; } public String getUsrpwdans() { return usrpwdans; } public void setUsrpwdans(String usrpwdans) { this.usrpwdans = usrpwdans; } public String getUsremail() { return usremail; } public void setUsremail(String usremail) { this.usremail = usremail; } public void setLoggerdao(ILoggerDao loggerdao) { this.loggerdao = loggerdao; } public void setUo(IUserOperation uo) { this.uo = uo; } public String getUserlist() { return userlist; } public void setUserlist(String userlist) { this.userlist = userlist; } public String searchUser() { try { ComUserInfo comuserinfo = new ComUserInfo(); if (comuserinfo.getUserid() != "") { List result = uo.searchUser(getUserid()); JsonUtil ju = new JsonUtil(); String jsresult = ju.collection2json(result); this.userlist = ("{" + "\"userlist\": " + jsresult + " }"); System.out.println(userlist); //response.getWriter().println(userlist); return SUCCESS; } else { ssn.add("errmsg", "User not login yet!"); return ERROR; } } catch (Exception e) { ssn.add("errmsg", e.getMessage()); return ERROR; } } } [/code] userAction返回的"userlist"数据如下: { "userlist": [ {"usrCreateBy":"","usrCreateDate":"","usrDisableDate":"", "usrEmail":"Frankie@together.com","usrId":"80319474","usrName":"Frankie", "usrPwd":"1233","usrPwdAns":"1+1","usrPwdQues":"2", "usrRemark":"","usrUpdateBy":"","usrUpdateDate":""}, {"usrCreateBy":"","usrCreateDate":"","usrDisableDate":"", "usrEmail":"Justin@together.com","usrId":"80334272","usrName":"Justin", "usrPwd":"1234","usrPwdAns":"2","usrPwdQues":"1+1", "usrRemark":"nothing","usrUpdateBy":"","usrUpdateDate":""}, {"usrCreateBy":"","usrCreateDate":"","usrDisableDate":"", "usrEmail":"Justin@together.com","usrId":"sa","usrName":"sysadmin", "usrPwd":"a","usrPwdAns":"2","usrPwdQues":"1+1", "usrRemark":"nothing","usrUpdateBy":"","usrUpdateDate":""} ] } 输出页面的js: userlist.js: [code="java"] /* * Ext JS Library 3.0 RC2 Copyright(c) 2006-2009, Ext JS, LLC. * licensing@extjs.com * * http://extjs.com/license */ Ext.onReady(function() { Ext.QuickTips.init(); // turn on validation errors beside the field globally // Ext.form.Field.prototype.msgTarget = 'side'; var cm = new Ext.grid.ColumnModel([{ header : '用户ID', dataIndex : 'userId' }, { header : '用户昵称', dataIndex : 'usrName' }, { header : '密码', dataIndex : 'usrPwd' }, { header : '电子邮件地址', dataIndex : 'usrEmail' }, { header : '密码提示问题', dataIndex : 'usrPwdQues' }, { header : '密码提示问题答案', dataIndex : 'usrPwdAns' }]); var reader = new Ext.data.Store({ root : 'userlist' }, [{ name : 'usrId', mapping : 'userId' }, { name : 'usrName', mapping : 'usrName' }, { name : 'usrPwd', mapping : 'usrPwd' }, { name : 'usrEmail', mapping : 'usrEmail' }, { name : 'usrPwdQues', mapping : 'usrPwdQues' }, { name : 'usrPwdAns', mapping : 'usrPwdAns' }]); var pxy = new Ext.data.HttpProxy({ url : 'searchuser.action', method : 'GET' }) var ds = new Ext.data.JsonStore({ proxy : pxy, reader : reader }); var grid = new Ext.grid.GridPanel({ store : ds, sm : sm, cm : cm, loadMask : { msg : ' 数据加载中...' }, autoHeight : true }); var sm = new Ext.grid.CheckboxSelectionModel(); var vp = new Ext.Viewport({ layout : "border", frame : true, title : "注册", autoHeight : true, items : [{// Viewport region : "north", height : 100, title : "顶部面板" }, { region : "south", height : 50, title : "底部面板" }, { region : "west", width : "20%", title : "左边面板" }, { region : "east", width : "20%", title : "右边面板" }, { region : "center", title : "中央面板", items : [frm = new Ext.FormPanel({ items : [grid] } /* Eof formpanel */) /* Eof border center */] } /* Eof Viewport */] }); grid.render(); ds.load(); vp.render(document.body); }); [/code] [b]问题补充:[/b] 感谢 yourgame (资深架构师) 的回答 你完全理解错误了.. 如果用到了extjs 就不需要什么跳转了.你直接输出out.print(json); =========================================================== 您的意思是否我在问题里提到的"ExtJs是AJAX 实现的话,action是否一定是将数据返回到提交页面的?例如 getUser.jsp->searchuser.action->getUser.jsp."? 可是如果我想把数据放到其他页面的话,我应该怎么做才能把数据送过去呢.请不吝赐教. [b]问题补充:[/b] 感谢两位的回答,我现在转换了思路,当用户提交了之后,先进行页面跳转到userlist.jsp,然后才在userlist,jsp里去请求action的返回数据,并放到GridPanel里,不知道这种思路是否可行. 即: getUser.jsp->Submit->redirect->userlist.jsp->searchuser.action->userlist.jsp(Grid展现)
mvc模式的extjs4中pannel多选问题(在线等 急)
需求:我需要在查询列表面板panel中添加多选项,并可以通过点击查询面板panel上的按钮获取查询列表面板的所有选中值。 现象:方法一、我使用selModel : new Ext.selection.CheckboxModel(),点击查询面板的按钮可以获取到多选值,通过弹出框显示出来,但是关闭弹出框以后,只能通过表头的多选框进行全选或取消全选,单击列表中的个别行或行前的多选框就没反应; 方法二、我使用selModel : {selType : 'checkboxmodel'},multiSelect:true,点击查询面板的按钮就获取不到多选值了,总提示获取到的值为空。 注意:获取选中项方法我使用的是Ext.widget("bfbRefundSettlementGridView").getSelectionModel().getSelection();不支持getSelections()方法,也不支持getSelection(),也不支持Ext.widget("bfbRefundSettlementGridView").getSelectionModel().getSelection()[0].data方法。 部分代码如下: //定义组件 Ext.define('MB.view.bfbRefundSettlement.BfbRefundSettlementGridView', { extend : "Ext.grid.Panel", alias : 'widget.bfbRefundSettlementGridView', store: "MB.store.BfbRefundSettlementStore", selModel : { selType : 'checkboxmodel' }, multiSelect:true,//允许多选 autoRender:true, columnLines: true, width: '100%', loadMask: true, // 读取数据时的遮罩和提示功能即加载loding... frame: true, resizable: true, forceFit: false, height:500, initComponent : function() { Ext.QuickTips.init(); var sm = new Ext.selection.CheckboxModel(); var me = this; me.columns = [ { text:'序号', xtype: 'rownumberer', width:50 }, { header: '批次号', dataIndex: 'billNo',width: 150,align: 'center'},··· ··· //controller中的按钮方法: var grid = Ext.widget("bfbRefundSettlementGridView"); var records = grid.getSelectionModel().getSelection(); if(records.length==0){ Ext.MessageBox.show({ title:"提示", msg:"请先选择您要操作的行!" }); return; }else{ for(var i = 0; i < records.length; i++){ ids += records[i].get("billNo"); if(i<records.length-1){ ids = ids + ","; } } Ext.MessageBox.alert('提示',ids); } 或者使用方法一 ,使得弹出提示框后仍可以选中获取消个别行,或者使用方法二,可以获取选中行。我看不出问题到底出在哪里,还请各位ext高手指教。
Extjs 复选问题
var areaProvinceTree = new Ext.tree.TreePanel({ id : 'areaProvincetree', width : (mywidth - 200) * 1 / 4 - 2, height : myheight * 1 / 2, title : '地域范围', autoScroll : true, containerScroll : true, root : new Ext.tree.AsyncTreeNode({ text : '地域范围', draggable : false, isAncestor : true, checked : false, id : '-1' }), loader : new Ext.tree.TreeLoader({ dataUrl : 'showAreaProvinceTree.action',//返回所有数据 baseParams : { type : '' } }) }); areaProvinceTree.on('checkchange', function(node, checked) { node.expand(); node.attributes.checked = checked; node.eachChild(function(child) { child.ui.toggleCheck(checked); child.attributes.checked = checked; child.fireEvent('checkchange', child, checked); }); }, areaProvinceTree); areaProvinceTree.on('load', function() { //tempMsg.areaProvince为dwr返回的放有节点数据的数组 if (tempMsg != null && tempMsg.areaProvince.length > 0) { for (var i = 0; i < tempMsg.areaProvince.length; i++) { areaProvinceTree.getNodeById(tempMsg.areaProvince[i].statisticsObjectId).attributes.checked = true; } tempMsg.areaProvince = []; } }); 问题是rootNode.expand();只展开一层,如果我自己写全部展开的话。没展开的节点还是找不到的。 全部展开后的事件,好像又没有吧!?怎么办啊? [b]问题补充:[/b] tree的json数据会根据其他控件选择情况返回不同的数据。 grid的行点击事件又会根据dwr返回的数据,将所有返回的节点进行选择。如果在后台直接将json数据封装好的话。后台会特别复杂的。 dwr返回的数据就是节点的id。选择树中id为该数据的节点(也就是打勾)。 说白了,就是需要一个在前台进行树节点选择。 但是要在树数据加载完后,并且全部展开后才进行树节点选择。异步的问题。!!
Extjs4使用mvc模式,封装Store层的ArrayStore无法动态加载后台数据
store层代码 ``` Ext.define('Desktop.store.function.FunctionStore',{ extend: 'Ext.data.ArrayStore', requires:['Desktop.model.function.UserModel'], model: 'Desktop.model.function.UserModel', autoLoad: true, proxy:{ type:'ajax', url:'index/userFindAll.do', reader: { type: 'json' } } }); ``` view层代码 ``` Ext.define('Desktop.view.function.FunctionGrid', { extend: 'Ext.panel.Panel', requires: ['Desktop.store.function.FunctionStore'], alias: 'widget.itgrid', itemId: 'sampleTest', layout: { type: 'border' }, title: '表单', initComponent: function() { var me = this; var store = Ext.create('Desktop.store.function.FunctionStore'); store.load(); // var store = Ext.create('Ext.data.ArrayStore',{ // model:'Desktop.model.function.UserModel', // proxy:{ // type:'ajax', // url:'index/userFindAll.do' // } // }); // store.load(); //声明行编辑器插件 var rowEditing = Ext.create('Ext.grid.plugin.RowEditing', { clicksToMoveEditor: 1, autoCancel: false }); //复选框插件 var sm = Ext.create('Ext.selection.CheckboxModel'); Ext.applyIf(me, { items: [{ id:'itl', xtype:'gridpanel', bodyPadding: 0, region: 'center', columns: [{ text: 'id', width: 97, sortable: true, renderer: this.change, dataIndex: 'id' },{ text: 'groupId', width: 97, sortable: true, renderer: this.pctChange, dataIndex: 'groupId' },{ text: 'userName', locked: true, width: 200, sortable: false, dataIndex: 'userName' },{ text: 'userPass', width: 97, sortable: false, dataIndex: 'userPass' },{ text: 'userDes', width: 97, sortable: false, dataIndex: 'userDes' },{ text: 'modifyTime', width: 97, sortable: false, dataIndex: 'modifyTime' },{ text: 'userPass', width: 97, sortable: false, dataIndex: 'userPass' },{ text: 'userDes', width: 97, sortable: false, dataIndex: 'userDes' },{ text: 'modifyTime', width: 97, sortable: false, dataIndex: 'modifyTime' },{ text: 'userPass', width: 97, sortable: false, dataIndex: 'userPass' },{ text: 'userDes', width: 97, sortable: false, dataIndex: 'userDes' },{ text: 'userPass', width: 97, sortable: false, dataIndex: 'userPass' },{ text: 'userDes', width: 97, sortable: false, dataIndex: 'userDes' }], store: store, selModel: sm }] }); me.callParent(arguments); }, change: function (val) { if (val > 0) { return '<span style="color:green;">' + val + '</span>'; } else if (val < 0) { return '<span style="color:red;">' + val + '</span>'; } return val; }, pctChange: function (val) { if (val > 0) { return '<span style="color:green;">' + val + '%</span>'; } else if (val < 0) { return '<span style="color:red;">' + val + '%</span>'; } return val; } }); ```
Extjs 隐藏左边 菜单右边 tabpanel 里面的gridpanel不自适应宽度
如图所示:![图片说明](https://img-ask.csdn.net/upload/201604/15/1460703726_78195.png) 代码如下 // 单击菜单,右边tabpanel 添加一个grid显示数据 var pl = new Ext.Panel({ id : node.attributes.id, title : node.attributes.text, border : false, // 边框 autoScroll : true, // 自动滚动条 closable : true, // 关闭选项 layout : 'fit', // 布局样式 frame : true, region : 'center', // 中间位置 sidebarChange : false, iconCls : 'users', // 图标样式 autoLoad : { url : node.attributes.url, scripts : true, discardUrl : true, nocache : true, sidebarChange:false,//用于控制 text : "页面加载中,请稍候……" } // listeners : { // activate : function(me, eOpts) { // if (me.sidebarChange) { // me.sidebarChange = false; // me.loader.load(); // // } // center.setActiveTab(me); // 设置默认标签 // } // } }); center.add(pl); center.setActiveTab(pl); // 设置默认标签 grid的页面代码 var editorGrid10 = new Ext.grid.EditorGridPanel({ id : 'editorGrid10', frame : false, // 边框的样式,是否显示 border : false, // 是否显示边框,页面显示的效果 layout : 'fit', //布局样式 height : 450, autoWidth : true, // 是否自动扩充宽度 //width:document.body.getComputedWidth()-100, store : gStore, // 填充store sm : enditsm10, // 用于显示复选框,必加,去掉该项的话列将变成单选框模式 cm : cModel10, // grid可编辑列模型,colModel简写 renderTo : Ext.get('tt'), // 表格所在的位置 autoExpandColumn : true, // 自动占满剩余空列 loadMask : { // 表示为当grid加载过程中,会有一个Ext.LoadMask的遮罩效果。默认为false。 msg : '正在加载数据,请稍后!' }, autoScroll : true, // 自动滚动条 autoEncode : true, // True表示为对任何值和任何后来输入的值都要自动HTML编码或解码 bbar : editbbarpadding10, // 面板下方的工具栏 .......后面代码省略 }); 求教各路大神!
Java学习的正确打开方式
在博主认为,对于入门级学习java的最佳学习方法莫过于视频+博客+书籍+总结,前三者博主将淋漓尽致地挥毫于这篇博客文章中,至于总结在于个人,实际上越到后面你会发现学习的最好方式就是阅读参考官方文档其次就是国内的书籍,博客次之,这又是一个层次了,这里暂时不提后面再谈。博主将为各位入门java保驾护航,各位只管冲鸭!!!上天是公平的,只要不辜负时间,时间自然不会辜负你。 何谓学习?博主所理解的学习,它是一个过程,是一个不断累积、不断沉淀、不断总结、善于传达自己的个人见解以及乐于分享的过程。
程序员必须掌握的核心算法有哪些?
由于我之前一直强调数据结构以及算法学习的重要性,所以就有一些读者经常问我,数据结构与算法应该要学习到哪个程度呢?,说实话,这个问题我不知道要怎么回答你,主要取决于你想学习到哪些程度,不过针对这个问题,我稍微总结一下我学过的算法知识点,以及我觉得值得学习的算法。这些算法与数据结构的学习大多数是零散的,并没有一本把他们全部覆盖的书籍。下面是我觉得值得学习的一些算法以及数据结构,当然,我也会整理一些看过...
大学四年自学走来,这些私藏的实用工具/学习网站我贡献出来了
大学四年,看课本是不可能一直看课本的了,对于学习,特别是自学,善于搜索网上的一些资源来辅助,还是非常有必要的,下面我就把这几年私藏的各种资源,网站贡献出来给你们。主要有:电子书搜索、实用工具、在线视频学习网站、非视频学习网站、软件下载、面试/求职必备网站。 注意:文中提到的所有资源,文末我都给你整理好了,你们只管拿去,如果觉得不错,转发、分享就是最大的支持了。 一、电子书搜索 对于大部分程序员...
linux系列之常用运维命令整理笔录
本博客记录工作中需要的linux运维命令,大学时候开始接触linux,会一些基本操作,可是都没有整理起来,加上是做开发,不做运维,有些命令忘记了,所以现在整理成博客,当然vi,文件操作等就不介绍了,慢慢积累一些其它拓展的命令,博客不定时更新 free -m 其中:m表示兆,也可以用g,注意都要小写 Men:表示物理内存统计 total:表示物理内存总数(total=used+free) use...
比特币原理详解
一、什么是比特币 比特币是一种电子货币,是一种基于密码学的货币,在2008年11月1日由中本聪发表比特币白皮书,文中提出了一种去中心化的电子记账系统,我们平时的电子现金是银行来记账,因为银行的背后是国家信用。去中心化电子记账系统是参与者共同记账。比特币可以防止主权危机、信用风险。其好处不多做赘述,这一层面介绍的文章很多,本文主要从更深层的技术原理角度进行介绍。 二、问题引入 假设现有4个人...
程序员接私活怎样防止做完了不给钱?
首先跟大家说明一点,我们做 IT 类的外包开发,是非标品开发,所以很有可能在开发过程中会有这样那样的需求修改,而这种需求修改很容易造成扯皮,进而影响到费用支付,甚至出现做完了项目收不到钱的情况。 那么,怎么保证自己的薪酬安全呢? 我们在开工前,一定要做好一些证据方面的准备(也就是“讨薪”的理论依据),这其中最重要的就是需求文档和验收标准。一定要让需求方提供这两个文档资料作为开发的基础。之后开发...
网页实现一个简单的音乐播放器(大佬别看。(⊙﹏⊙))
今天闲着无事,就想写点东西。然后听了下歌,就打算写个播放器。 于是乎用h5 audio的加上js简单的播放器完工了。 演示地点演示 html代码如下` music 这个年纪 七月的风 音乐 ` 然后就是css`*{ margin: 0; padding: 0; text-decoration: none; list-...
Python十大装B语法
Python 是一种代表简单思想的语言,其语法相对简单,很容易上手。不过,如果就此小视 Python 语法的精妙和深邃,那就大错特错了。本文精心筛选了最能展现 Python 语法之精妙的十个知识点,并附上详细的实例代码。如能在实战中融会贯通、灵活使用,必将使代码更为精炼、高效,同时也会极大提升代码B格,使之看上去更老练,读起来更优雅。
数据库优化 - SQL优化
以实际SQL入手,带你一步一步走上SQL优化之路!
通俗易懂地给女朋友讲:线程池的内部原理
餐盘在灯光的照耀下格外晶莹洁白,女朋友拿起红酒杯轻轻地抿了一小口,对我说:“经常听你说线程池,到底线程池到底是个什么原理?”
经典算法(5)杨辉三角
杨辉三角 是经典算法,这篇博客对它的算法思想进行了讲解,并有完整的代码实现。
使用 Docker 部署 Spring Boot 项目
Docker 技术发展为微服务落地提供了更加便利的环境,使用 Docker 部署 Spring Boot 其实非常简单,这篇文章我们就来简单学习下。首先构建一个简单的 S...
英特尔不为人知的 B 面
从 PC 时代至今,众人只知在 CPU、GPU、XPU、制程、工艺等战场中,英特尔在与同行硬件芯片制造商们的竞争中杀出重围,且在不断的成长进化中,成为全球知名的半导体公司。殊不知,在「刚硬」的背后,英特尔「柔性」的软件早已经做到了全方位的支持与支撑,并持续发挥独特的生态价值,推动产业合作共赢。 而对于这一不知人知的 B 面,很多人将其称之为英特尔隐形的翅膀,虽低调,但是影响力却不容小觑。 那么,在...
面试官:你连RESTful都不知道我怎么敢要你?
干货,2019 RESTful最贱实践
刷了几千道算法题,这些我私藏的刷题网站都在这里了!
遥想当年,机缘巧合入了 ACM 的坑,周边巨擘林立,从此过上了"天天被虐似死狗"的生活… 然而我是谁,我可是死狗中的战斗鸡,智力不够那刷题来凑,开始了夜以继日哼哧哼哧刷题的日子,从此"读题与提交齐飞, AC 与 WA 一色 ",我惊喜的发现被题虐既刺激又有快感,那一刻我泪流满面。这么好的事儿作为一个正直的人绝不能自己独享,经过激烈的颅内斗争,我决定把我私藏的十几个 T 的,阿不,十几个刷题网...
白话阿里巴巴Java开发手册高级篇
不久前,阿里巴巴发布了《阿里巴巴Java开发手册》,总结了阿里巴巴内部实际项目开发过程中开发人员应该遵守的研发流程规范,这些流程规范在一定程度上能够保证最终的项目交付质量,通过在时间中总结模式,并推广给广大开发人员,来避免研发人员在实践中容易犯的错误,确保最终在大规模协作的项目中达成既定目标。 无独有偶,笔者去年在公司里负责升级和制定研发流程、设计模板、设计标准、代码标准等规范,并在实际工作中进行...
SQL-小白最佳入门sql查询一
不要偷偷的查询我的个人资料,即使你再喜欢我,也不要这样,真的不好;
redis分布式锁,面试官请随便问,我都会
文章有点长并且绕,先来个图片缓冲下! 前言 现在的业务场景越来越复杂,使用的架构也就越来越复杂,分布式、高并发已经是业务要求的常态。像腾讯系的不少服务,还有CDN优化、异地多备份等处理。 说到分布式,就必然涉及到分布式锁的概念,如何保证不同机器不同线程的分布式锁同步呢? 实现要点 互斥性,同一时刻,智能有一个客户端持有锁。 防止死锁发生,如果持有锁的客户端崩溃没有主动释放锁,也要保证锁可以正常释...
项目中的if else太多了,该怎么重构?
介绍 最近跟着公司的大佬开发了一款IM系统,类似QQ和微信哈,就是聊天软件。我们有一部分业务逻辑是这样的 if (msgType = "文本") { // dosomething } else if(msgType = "图片") { // doshomething } else if(msgType = "视频") { // doshomething } else { // doshom...
Nginx 原理和架构
Nginx 是一个免费的,开源的,高性能的 HTTP 服务器和反向代理,以及 IMAP / POP3 代理服务器。Nginx 以其高性能,稳定性,丰富的功能,简单的配置和低资源消耗而闻名。 Nginx 的整体架构 Nginx 里有一个 master 进程和多个 worker 进程。master 进程并不处理网络请求,主要负责调度工作进程:加载配置、启动工作进程及非停升级。worker 进程负责处...
“狗屁不通文章生成器”登顶GitHub热榜,分分钟写出万字形式主义大作
一、垃圾文字生成器介绍 最近在浏览GitHub的时候,发现了这样一个骨骼清奇的雷人项目,而且热度还特别高。 项目中文名:狗屁不通文章生成器 项目英文名:BullshitGenerator 根据作者的介绍,他是偶尔需要一些中文文字用于GUI开发时测试文本渲染,因此开发了这个废话生成器。但由于生成的废话实在是太过富于哲理,所以最近已经被小伙伴们给玩坏了。 他的文风可能是这样的: 你发现,...
程序员:我终于知道post和get的区别
是一个老生常谈的话题,然而随着不断的学习,对于以前的认识有很多误区,所以还是需要不断地总结的,学而时习之,不亦说乎
《程序人生》系列-这个程序员只用了20行代码就拿了冠军
你知道的越多,你不知道的越多 点赞再看,养成习惯GitHub上已经开源https://github.com/JavaFamily,有一线大厂面试点脑图,欢迎Star和完善 前言 这一期不算《吊打面试官》系列的,所有没前言我直接开始。 絮叨 本来应该是没有这期的,看过我上期的小伙伴应该是知道的嘛,双十一比较忙嘛,要值班又要去帮忙拍摄年会的视频素材,还得搞个程序员一天的Vlog,还要写BU...
加快推动区块链技术和产业创新发展,2019可信区块链峰会在京召开
11月8日,由中国信息通信研究院、中国通信标准化协会、中国互联网协会、可信区块链推进计划联合主办,科技行者协办的2019可信区块链峰会将在北京悠唐皇冠假日酒店开幕。   区块链技术被认为是继蒸汽机、电力、互联网之后,下一代颠覆性的核心技术。如果说蒸汽机释放了人类的生产力,电力解决了人类基本的生活需求,互联网彻底改变了信息传递的方式,区块链作为构造信任的技术有重要的价值。   1...
Java世界最常用的工具类库
Apache Commons Apache Commons有很多子项目 Google Guava 参考博客
程序员把地府后台管理系统做出来了,还有3.0版本!12月7号最新消息:已在开发中有github地址
第一幕:缘起 听说阎王爷要做个生死簿后台管理系统,我们派去了一个程序员…… 996程序员做的梦: 第一场:团队招募 为了应对地府管理危机,阎王打算找“人”开发一套地府后台管理系统,于是就在地府总经办群中发了项目需求。 话说还是中国电信的信号好,地府都是满格,哈哈!!! 经常会有外行朋友问:看某网站做的不错,功能也简单,你帮忙做一下? 而这次,面对这样的需求,这个程序员...
网易云6亿用户音乐推荐算法
网易云音乐是音乐爱好者的集聚地,云音乐推荐系统致力于通过 AI 算法的落地,实现用户千人千面的个性化推荐,为用户带来不一样的听歌体验。 本次分享重点介绍 AI 算法在音乐推荐中的应用实践,以及在算法落地过程中遇到的挑战和解决方案。 将从如下两个部分展开: AI算法在音乐推荐中的应用 音乐场景下的 AI 思考 从 2013 年 4 月正式上线至今,网易云音乐平台持续提供着:乐屏社区、UGC...
【技巧总结】位运算装逼指南
位算法的效率有多快我就不说,不信你可以去用 10 亿个数据模拟一下,今天给大家讲一讲位运算的一些经典例子。不过,最重要的不是看懂了这些例子就好,而是要在以后多去运用位运算这些技巧,当然,采用位运算,也是可以装逼的,不信,你往下看。我会从最简单的讲起,一道比一道难度递增,不过居然是讲技巧,那么也不会太难,相信你分分钟看懂。 判断奇偶数 判断一个数是基于还是偶数,相信很多人都做过,一般的做法的代码如下...
为什么要学数据结构?
一、前言 在可视化化程序设计的今天,借助于集成开发环境可以很快地生成程序,程序设计不再是计算机专业人员的专利。很多人认为,只要掌握几种开发工具就可以成为编程高手,其实,这是一种误解。要想成为一个专业的开发人员,至少需要以下三个条件: 1) 能够熟练地选择和设计各种数据结构和算法 2) 至少要能够熟练地掌握一门程序设计语言 3) 熟知所涉及的相关应用领域的知识 其中,后两个条件比较容易实现,而第一个...
Android 9.0 init 启动流程
阅读五分钟,每日十点,和您一起终身学习,这里是程序员Android本篇文章主要介绍Android开发中的部分知识点,通过阅读本篇文章,您将收获以下内容:一、启动流程概述一、 启动流程概述Android启动流程跟Linux启动类似,大致分为如下五个阶段。1.开机上电,加载固化的ROM。2.加载BootLoader,拉起Android OS。3.加载Uboot,初始外设,引导Kernel启动等。...
相关热词 c# 图片上传 c# gdi 占用内存 c#中遍历字典 c#控制台模拟dos c# 斜率 最小二乘法 c#进程延迟 c# mysql完整项目 c# grid 总行数 c# web浏览器插件 c# xml 生成xsd
立即提问