ExtJs表格点击超链接获取行的值.doc

ExtJs表格点击超链接获取行的值grid双击事件，并得到单元格的值，以上我试了下好像不行，最终我这样写了grid.addListener(rowdblclick, function (sm, rowIndex, e) var selectionModel = grid.getSelectionModel();var record = selectionModel.getSelected();alert(record.dataUserName););menuDisabled:true表示单列不可排序enableHenu:true所有列不可排序renderer:function(v) return v.link(v);ExtJs表格2009年11月09日 星期一 00:48行选择模式：Js代码var rowcount = grid.getSelectionNode().getSelections(); var rowcount = grid.getSelectionNode().getSelections();可以获取全部选中的记录，得到的rowcount将是一个Array，比如想获取sex列的数据，语句如下Js代码var strsex = rowcounti.get(sex); var strsex = rowcounti.get(sex);单元格选择模式如果在GridPanel的配置属性增加sm属性如下Js代码sm:new Ext.grid.CellSelectionModel(); sm:new Ext.grid.CellSelectionModel();则表格的选择模式为单元格选择模式。当单击时将选中对应的某一个单元格，而不是默认的选择某一行。选择方式如下Js代码var cell = grid.getSelectionNode().getSelectedCell(); var cell = grid.getSelectionNode().getSelectedCell();得到的cell记录了当前选择的行(cell0)以及列(cell1).可以通过一下语句得到该单元格数据Js代码var colname = grid.getColumnModel().getDataIndex(cell1); /获取列名 var celldata = grid.getStore().getAt(cell0).get(colname); /获取数据 var colname = grid.getColumnModel().getDataIndex(cell1); /获取列名var celldata = grid.getStore().getAt(cell0).get(colname); /获取数据getStore():获取表格的数据集getAt():获取该数据集cell0行get():获取该行colname的数据2） 为表格增加链接有时我们需要为表格中的某一列添加一个链接。可以利用renderer配置属性为该列添加html如下：id:3,header:名称,dataIndex:name,renderer:DomUrl,定义DomUrl方法Js代码function DomUrl(value) return +value+; function DomUrl(value)return +value+;如果表格内的数据是一个链接如：这样写法自然没有问题，但是大多数时候我们在表格中不会直接写一个链接，如果又需要根据单元格内容动态为链接添加几个参数。那这种写法就几乎没有什么用了。因为这个属性是在表格初始化的时候定义好的，而且表格初始化之后这个属性无法改变，也就是只读属性。处理方法如下：定义一个全局变量，初始值为0；DomUrl函数如下Js代码function DomUrl(value) var row = grid.getSelectionModel().selectRow(startrow);/选中当前行 var rownum = grid.getSelectionModel().getSelected();/获取当前行 startrow +; var strurl = abc.jsp?id= + rownum.get(id);/获取当前选中行的值，并组织链接字符串 return +value+; function DomUrl(value)var row = grid.getSelectionModel().selectRow(startrow);/选中当前行var rownum = grid.getSelectionModel().getSelected();/获取当前行startrow +;var strurl = abc.jsp?id= + rownum.get(id);/获取当前选中行的值，并组织链接字符串return +value+;不过不要忘记在下次提交的时候将startrow赋值为0。3） 表格的属性表格的属性分为配置属性（在操作表格时无法修改），以及其他可读写属性，方法，以及事件。如下：配置属性a) activeItem：渲染布局时激活的子元素。b) applyTo：指定渲染对象。c) autoDestroy：当容器的子元素从容器中移除时是否自动销毁。d) autoExpandColumn：指定自动填充表格剩余区域的列ide) autoExpandMax：可自动扩张的最大宽度。f) autoExpandMin：可自动扩张的最小宽度g) autoHeight:自动扩充高度h) autoShow：是否自动显示i) autoWidth：自动扩充宽度j) bbar/tbar：底部/顶部状态栏k) bufferResize：容器再布局的缓冲频率l) colModel/cm:列模式m) cls：组件的额外css格式。n) collapsible:是否显示快捷隐藏按钮o) defaults：指定默认配置。p) disableSelection：是否禁止选择表格行或列q) enableDragDrop：是否允许表格列的拖放操作。r) enableHdMenu：是否显示表格列的菜单。s) frame：边框是否显示t) loadMask: 是否显示加载动画u) selModel/sm：表格选择模式v) store:表格数据集w) stripeRows：是否显示分隔线。x) title：表格标题方法a) getColumnModel()：得到表格列模型b) getGridEl():得到表格下的元素c) getPosition():得到组件的当前位置，返回一个数组d) getSelectionModel():得到选中模型e) getSize():得到组件大小f) getStore():得到组件的数据集g) getView():得到表格的GridView对象。h) hide():隐藏当前组件i) isVisible():判断当前组件是否显示j) setDisabled( Boolean):设置组件的可用性k) un():解除组件的监听l) on()：为组件添加监听on ( String eventName, Function handler, Object scope )eventName:添加监听的名称handler:事件处理函数scope:事件响应的作用域,包括scope,delay,single,buffer。- base href= My JSP MyJsp.jsp starting page script type=text/javascript src=/js/ext-base.js script type=text/javascript src=/js/ext-all.js link rel=stylesheet type=text/css href=/resources/css/ext-all.css Ext.onReady(function() Ext.QuickTips.init(); Ext.state.Manager.setProvider(new Ext.state.CookieProvider(); var myData = 3m Co, 71.72, 0.02, 0.03, 9/1 12:00am, Alcoa Inc, 29.01, 0.42, 1.47, 9/1 12:00am, Altria Group Inc, 83.81, 0.28, 0.34, 9/1 12:00am, American Express Company, 52.55, 0.01, 0.02, 9/1 12:00am, American International Group, Inc., 64.13, 0.31, 0.49, 9/1 12:00am ; function change(val) if (val 0) return + val + ; else if (val 0) return + val + ; return val; function pctChange(val) if (val 0) return + val + %; else if (val 0) return + val + %; return val; var store = new Ext.data.ArrayStore( fields: name: company, renderer:getHideValue, name: price, type: float, name: change, type: float, name: pctChange, type: float, name: lastChange, type: date, dateFormat: n/j h:ia ); store.loadData(myData); function getHideValue(value) return var grid = new Ext.grid.GridPanel( store: store, columns: id :company, header : Company, width : 160, sortable : true, dataIndex: company , id :p, header : Price, width : 75, sortable : true, renderer : usMoney, dataIndex: price , header : Change, width : 75, sortable : true, renderer : change, dataIndex: change , header : % Change, width : 75, sortable : true, renderer : pctChange, dataIndex: pctChange , header : Last Updated, width : 85, sortable : true, renderer : Ext.util.Format.dateRenderer(m/d/Y), dataIndex: lastChange , xtype: actioncolumn, width: 50, items: icon : resources/delete.gif, / Use a URL in the icon config tooltip: Sell stock, handler: function(grid, rowIndex, colIndex) var rowcount = grid.getSelectionNode().getSelec