0

我正在尝试为 grid 的单元w2ui 添加颜色。

遵循文档后,我可以更改单元格和行的颜色(但单独更改)。

对于单个单元格:

records: [
            { recid: 1, fname: 'Jane', lname: 'Doe', email: 'jdoe@gmail.com', sdate: 384052483664, style: {3:'background-color: yellow; color: white;'}}           
        ]

对于单行:

records: [
                { recid: 1, fname: 'Jane', lname: 'Doe', email: 'jdoe@gmail.com', sdate: 384052483664, style: 'background-color: red; color: white;'}           
            ]

直到这部分没关系,因为我正在对记录进行硬编码。

问题:

我正在从服务器加载数据,并且根据某些条件设置规则,并且我想相应地更改颜色。

我的理解是,我只需要在服务器上添加样式(我使用的是 php 和 mysql,顺便说一句)。

下面是我的示例代码:

$Query = "SELECT @curRow := @curRow + 1 as id ,`x`, `y`, `z`, `a`, `b`, `c`, `d`, `e`, `f`, `g`, `h`, `i` 
        FROM `table_name` JOIN (SELECT @curRow := 0) r";
        //echo $Query;
        $code=mysqli_query($link,$Query);
        $data = array();
        while($row = mysqli_fetch_assoc($code))
        {
            if($row["id"]==1)
            {
                //$row['expanded']="'spinner'";
                //$object = (object) ['style' => "{ 5: 'color': 'red'; 'background-color': 'whilte' }"];
                //$row['style']=$object;
                $row['style']= "3:'background-color: red; color: black;'";
            }
            //var_dump ($row);
            $data[] = $row;
        }
        $arr = array("total" => count($data), 
        "records" => $data);

Assuemeif($row["id"]==1)是规则之一,所以在这里我尝试添加样式部分。如果您看到代码,我已经尝试了多种方法来为其添加样式。它只是不工作。但是,如果使用 php 打印行,我得到的行与它应该编码的方式完全一致(参见上述单单元格样式的代码)。但这并没有反映在表格中。

第二个问题

我想用一种颜色为行着色,最重要的是,我想为一个单独的单元格着色(两种不同的规则,一种用于行,一种用于列)。由于我无法达到第一个要求,所以我没有花太多时间在这个问题上。

第三个问题

如何使行的高度动态化?假设我有一个列名response,我为它分配了一个固定的宽度,当该行的内容超过宽度时,它会显示...在可用宽度之后。我想在下一行展示它。有可能这样做吗?

谢谢。

4

1 回答 1

1

要回答您的第一个问题:

style当它到达客户端时必须是 JSON 对象,因此在服务器端,它必须是稍后传递给的数组json_encode()

$row['style'] => array('5' => 'background-color: red; color: black;');
...
$result = json_encode($row);

回答你的第二个问题:

w2ui 1.5 的最新版本同时支持记录classstyle属性。

因此,要为行着色以不同方式着色行中的单个单元格,您可以使用:

records: [
    { recid: 1, fname: 'Jane', lname: 'Doe', class: 'my-css-class-for-the-row', style: {3: 'background-color: yellow; color: white;'} }           
];

style并且class既可以是字符串也可以是对象,因此您也可以反过来使用它style来为整行class着色并为特定单元格着色。


回答你的第三个问题:

由于虚拟滚动,行不能具有动态高度。这意味着,所有行必须具有相同的高度。但是,您可以使用更改所有行的高度

grid.recordHeight = 40; // height in pixels

同样,这需要最新的 1.5 版本的 w2ui,如果与列组一起使用,它看起来很古怪。

于 2016-08-03T09:20:59.387 回答