如何更改表格中的行颜色（SAPUI5）？

我有一个数据来自后端的表。 基于特定条件（来自后端（网关服务）的数据），如果该条件为真，则该特定行将具有不同的颜色并且将在整行上具有链接。 如果条件为假，则它将是正常行。

那么如何实现呢？

Answer 1

我认为改变颜色的方法很少，最简单的方法是改变关联控件的风格

.addStyleClass(myClass); .toggleStyleClass(myClass, true); 

在以下示例中JsBin – 警告过期行我在表行上使用以下内容

 row.$().addClass("overdue"); 

它将css样式“过期”添加到行的domRef中

Answer 2

现在支持行的语义颜色，可以使用属性highlight来利用这些颜色

• 使用sap.m.Table时，在ColumnListItem上（从1.44开始）：

    ... 

• 使用sap.ui.table.Table时的RawSettings（从1.48开始）：

     ... 

  

Answer 3

我假设你有常规的HTML表格，然后：

 $("table tr").each(function(){ if( condition ){ //your condition eg. $(this).children("td:eq(1)").val() == sth $(this).css("background":COLOR); } }); 

Answer 4

@Ashish很难只使用sapui5。 在这种情况下你需要使用jquery。 如果该条件为true，则获取行的索引并使用该选择器，然后使用like

 $('.myTable tr:nth-child('+rowindex+')').css("background-color","red") 

试试这个。 不确定

Answer 5

在UI5中，我不确定您是否可以一次执行此行，但您可以使用valueState属性为单个单元格执行此valueState ：

 var oConditionalColumn = new sap.ui.table.Column({ label: new sap.ui.commons.Label({ text: "Some label" }), template: (new sap.ui.commons.TextField({ value : "{myfield}", valueState : { parts : [myfield], formatter : function(oValue) { return (oValue === undefined || oValue == null || oValue == "" || isNaN(oValue) || parseInt(oValue) == 0) ? sap.ui.core.ValueState.Error : sap.ui.core.ValueState.None; } }, })) }); 

或者，在加载模型时，根据条件预先设置一个额外的计算属性，并使用该属性以不同的颜色渲染行中的每个单元格，并对上面的代码进行mior修改。

Answer 6

我们可以使用sap.m.ObjectStatus来提供颜色，而不是使用css。

var iDtemplate = new sap.m.ColumnListItem（“idTemplate”，{type：“Navigation”，visible：true，selected：true，cells：[

  new sap.m.ObjectStatus({ text:"{SlNo}", }).bindProperty("state", "number", function(value) { return getStatusColor(value); }), new sap.m.ObjectStatus({ text:"{Name}", }).bindProperty("state", "number", function(value) { return getStatusColor(value); }), ], pressListMethod: function(event){ var bindingContext = event.getSource().getBindingContext(); } }); function getStatusColor(status) { if (status === '') { return "Error"; } else { return "Success"; } } 

根据数字字段，我们为列Slno和Name提供颜色。