取选择行的ID

本文介绍了如何在ExtJS中通过GridPanel和TreePanel的事件监听器获取选中行和节点的数据,包括使用GridPanel的`getSelections()`方法和TreePanel的`click`事件来获取选中项的ID。

例子一:

现在我们有一个GridPanel,展示的列表数据,现在我们想点击其中一行获得选中行的ID。首先,我们想到的就是在GridPanel中添加一个监听事件

<Listeners><RowClick Fn="SelectFn" /></Listeners>

JS的函数SelectFn中就需要写代码了。点击了一行就是选中了这行,然后我们就利用ExtJSAPI,找到GridPanel部分,我们去找方法,是否有可以获得选中行的数据的类似方法。结果我们可以发现有以下这一种方法:

35.getSelectionModel() : SelectionModel

Returns the grid's selection model configured by the selModel configuration option. If no selection model was config...Returns the grid's selection model configured by the selModel configuration option. If no selection model was configured, this will create and return a RowSelectionModel.

参数:None

返回:SelectionModel

继续查找,在ExtJSgrid目录下面我们发现有19.RowSelectionModel,我们查看下这个类下面会有什么方法,结果我们找到了方法:

12.getSelections() : Array

Returns the selected records

参数:None

返回:Array of select records

很明显这就是我们要找的方法,该方法返回了选中的数据的数组。

获取到了records数据。这时候JS函数SelectFn可以这么写:

function SelectFn() {

    //获取选中行的所有记录

var records = GridPanelEmployeeInfo.getSelectionModel().getSelections();

}

然后试着调试程序,我们将发现

最后我们就找到了自己想要的ID

//选择行时

function SelectFn() {

    //获取选中行的ID

    var records = GridPanelEmployeeInfo.getSelectionModel().getSelections();

    var employeeID = records[0].data.ID;

}

 

晕:上面的解法太TM复杂了,明显可以直接这样,查看GridPanel的的ExtJS的监听点击事件发现如下:

40.rowselect: ( SelectionModel this, Number rowIndex, Ext.data.Record r )

Fires when a row is selected.

参数分别就是this,行号,还有record

所以JS我们可以直接这样写:

//选择行时,按钮亮起

function SelectFn(selectionModel, rowIndex, record) {

    //获取选中行的ID

    employeeID = record.data.ID;

}

 

一步到位,方便简洁。

也可以先找到Store然后用Store里的根据行号获得record的方法

//获取选中行的数据

 var records = GridPanelEmployeeInfo.getStore().getAt(rowIndex);

 employeeID = record.data.ID;

 

例子二:

现在有一棵树,我们要在点击树节点的时候获取点击的ID,首先我们查找ExtJSAPI,在TreePanel的事件中,我们发现了以下事件:

102. click: ( Node node, Ext.EventObject e )

Fires when a node is clicked,Listeners will be called with the following arguments:

nodeNodeThe node

eExt.EventObject

我们可以发现该事件的参数有两个,第一个就是点击的节点!

然后我们查看TreeNodeAPI,发现有属性id。因此代码也就出来了,先在前台的TreePanel中添加监听点击事件

<Listeners>Click Fn="clickNode" /></Listeners>

然后在JS中的方法如下:

//点击树节点

function clickNode(node, e) {

    var departmentid = node.id;  //点击节点的ID

}
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值