Question

我在使用sclass属性正确设置网格中行的背景颜色时遇到问题。我需要在特定列值从null更改为某些内容时更改背景，或者在创建网格时，此列仍具有与null不同的值。所以我不需要改变所有的背景线，但只需要改变它们中的一些。

这是我写的风格：

<style>        

        .returned .z-row-cnt, .returned td.z-row-inner
        {
        background: none repeat scroll 0% 0% #D0C791;
        }

        .returned tr.z-row td.z-row-inner, .returned tr.z-row .z-cell {
        background: none repeat scroll 0% 0% #D0C791;
        }

        .returned .z-row {
        background-color: #D0C791;
        }

        .returned .z-label, .returned .z-button .z-button-cm {
        color:  #EFE9CE;
        }
</style>

这是网格：

<grid span="true" model="@bind(vm.exitRequests)"                           
      emptyMessage="Nessun mezzo/Nessuna richiesta trovati" height="100%" width="100%">
      <columns sclass="myColumn">
         <column width="18%;" label="Tipo Mezzo" />
         <column width="18%;" label="Nome - Targa" />
         <column width="18%;" label="Data Richiesta Uscita" />
         <column sclass="myColumn" width="18%;" label="Data Richiesta Rientro" 
              sortDescending="@bind(vm.openRequestComparatorDesc)"
              sortAscending="@bind(vm.openRequestComparatorAsc)" sortDirection="ascending"/>
         <column width="10%;" />
         <column width="8%;" />
         <column width="9%;" />                            
      </columns>                        
      <rows>                            
          <template name="model" var="request">
              <row sclass="@load(vm.getMySclass(request))">
                  ...

视图模型方法：

public String getMySclass(OpenRequest request){
        if (request.getActivity() != null && request.getActivity().getCloseTime() != null) {
            return "returned";            
        } else return "working";
    }

使用此样式，它只会更改单元格的内部部分，但会更改全局

tr.z-row td.z-row-inner

赢得我的

。返回tr.z-row td.z-row-inner

没有效果。

Answer 1

通过将sclass放在row上，并使用CSS选择器指定“内部”组件的样式，您走在正确的轨道上。

我相信您正在寻找的CSS选择器将是：

tr.z-row.returned td.z-row-inner

这将选择tr 和 z-row样式类的所有表格行（returned）标记。您在帖子末尾提议的CSS选择器是选择所有带有z-row样式类的表行标记，它们是returned样式类的后代。

您可以在此处详细了解CSS选择器的这个（有用的）细微差别：
http://css-tricks.com/multiple-class-id-selectors/

zk在行网格中使用sclass

1 个答案: