我有一个sap.ui.table.Table,其selectionMode
是Single
,而selectionBehavior
是RowOnly
。
我想根据内容以编程方式选择一行;
有一些代码可以按索引选择
但是我无法获取要选择其行的内容的索引。
还有其他方法吗?
答案 0 :(得分:2)
正如问题中的commented一样,目前还没有直接的解决方案来按内容选择以编程方式选择行。但我读到:
我想要一个有效的答案。最佳做法/建议不被接受。
如果仍然如此,我认为您可以访问内部属性。我正在使用的唯一内部属性是 ODataListBinding 实例中的aKeys
。以下摘录来自此示例:https://embed.plnkr.co/7lcVJOaYsnIMJO1w [1]
<Table xmlns="sap.ui.table"
id="myGridTable"
selectionMode="Single"
selectionBehavior="RowOnly"
rows="{
path: '/Customers',
events: {
change: '.onRowsDataChange'
}
}"
>
<!-- columns -->
</Table>
Controller.extend("demo.controller.TableSingleSelect", {
onRowsDataChange: function(event) {
this.selectCustomer(/*your key part(s) e.g.:*/ "ANTON"/*, ...*/);
},
selectCustomer: function(customerId/*, ...*/) {
const rowsBinding = this.byId("myGridTable").getBinding("rows");
this.selectIndexByKey(rowsBinding.getModel().createKey("Customers", {
CustomerID: customerId,
//...
}), rowsBinding.aKeys);
},
selectIndexByKey: function(targetKey, keys) {
const table = this.byId("myGridTable");
const index = +Object.keys(keys).find(key => targetKey === keys[key]);
const shouldSelect = index > -1 && !table.isIndexSelected(index);
return shouldSelect ? table.setSelectedIndex(index) : table;
},
});
<Table xmlns="sap.ui.table"
id="myGridTable"
selectionMode="MultiToggle"
rows="{
path: '/Orders',
events: {
change: '.onRowsDataChange'
}
}"
>
<!-- columns -->
</Table>
Controller.extend("demo.controller.TableMultiSelect", {
onRowsDataChange: function(event) {
const value1 = new Date("1996"); // 1996-01-01
const value2 = new Date("1997"); // 1997-01-01
this.selectOrdersBy("OrderDate", "BT", value1, value2);
},
selectOrdersBy: function(propertyName, filterOperator, value1, value2) {
const table = this.byId("myGridTable").clearSelection();
const keys = table.getBinding("rows").aKeys;
const loadedContexts = this.getLoadedContexts(keys, table, "rows");
const filteredContexts = FilterProcessor.apply(loadedContexts, [
new Filter(propertyName, filterOperator, value1, value2),
], (context, path) => context && context.getProperty(path));
this.selectIndices(keys, filteredContexts, table);
},
getLoadedContexts: function(keys, control, aggregationName) {
const model = control.getBinding(aggregationName).getModel();
const parameters = control.getBindingInfo(aggregationName).parameters;
return keys.map(key => model.createBindingContext(`/${key}`, parameters));
},
selectIndices: (keys, contexts, table) => Object.keys(keys).map(index => +index)
.filter(i => contexts.find(context => `/${keys[i]}` == context.getPath()))
.map(i => table.isIndexSelected(i) || table.addSelectionInterval(i, i)),
});
* FilterProcessor是私有模块。
内部属性aKeys
由加载的上下文中的键组成,这些键的索引反映了表行索引。例如:如果该表已加载3行,并且我调用table.getContextByIndex(90)
,则aKeys
将是:
0: "Customers('ALFKI')"
1: "Customers('ANATR')"
2: "Customers('ANTON')"
90: "Customers('WOLZA')"
在任何change上都会触发ChangeReason处理程序onRowsDataChange
。这样一来,无论表格行,排序,过滤,刷新等情况如何,都不会删除选择内容。
[1]:此答案中的示例与 ODataModel 一起使用。如果是客户端 JSONModel ,请查看以下答案:stackoverflow.com/a/52664812。
答案 1 :(得分:1)
这小段代码为我完成了工作。表绑定到JSONModel。
const rowsBinding = oTable.getBinding("rows");
var index1 = -1;
rowsBinding.oList.find(function(element){
index1++;
if(element.yourField== "your Content")
{
oTable.setSelectedIndex(index1);
}
});
现在,我可以根据内容选择我的行。
答案 2 :(得分:1)
还有另一个要求使用JSONModel做到这一点。所以就在这里。
以下摘录来自https://embed.plnkr.co/xuSU3uH1rkXmEAV7:
<Table xmlns="sap.ui.table"
id="myGridTable"
selectionMode="Single"
selectionBehavior="RowOnly"
rows="{
path: '/Customers',
events: {
change: '.onRowsDataChange'
}
}"
>
<!-- columns -->
</Table>
Controller.extend("demo.controller.TableSingleSelect", {
onRowsDataChange: function(event) {
this.selectWhere(context => context.getProperty("CustomerID") == "ANTON" /*&& ...*/);
},
selectWhere: function(keysAreMatching) {
const table = this.byId("myGridTable");
const contexts = table.getBinding("rows").getContexts();
const index = this.getRowIndexWhere(keysAreMatching, contexts);
return this.selectRowByIndex(index, table);
},
getRowIndexWhere: function(keysAreMatching, contexts) {
let index = -1;
contexts.find((context, i) => keysAreMatching(context) && (index = i));
return index;
},
selectRowByIndex: function(i, table) {
const shouldSelect = i > -1 && !table.isIndexSelected(i);
return shouldSelect ? setTimeout(() => table.setSelectedIndex(i)) : table;
},
});
对于像JSONModel这样的客户端模型,查找某些行比使用服务器端模型要容易一些,因为所有必需的数据都可以通过rowsBinding.getContexts()
在本地获得。返回的上下文被分配给与表的行索引相对应的索引。