Hi,

I'm facing an issue where i created a KWidget on my dashboard. Where i want to set color based on the value of the column. For example there is column A and column B, if the column B value is more than column A then i want to set the font color of column B to Green if the column B is less than the value of column A then set the font color of column B to Red. Is there a way to set the color based on my condition?

Below is an example of the code.

<?php

namespace demo\kwidgets;

use \koolreport\dashboard\widgets\KWidget;

use \demo\AutoMaker;
use \koolreport\dashboard\ColorList;

class DataTablesDemo extends KWidget
{
    protected function dataSource()
    {
        return AutoMaker::rawSQL("select name, columnA, columnB from payments");
    }

    protected function onCreated()
    {
        $this
        ->use(\koolreport\datagrid\DataTables::class)
        ->settings([
            "options"=>array(
                "paging"=>true,
            )
        ]);
    }

}

Thanks in advance.

Regards, Afieq

Hi,

Any help can i get on this problem?

Thanks in advance.

Regards, Afieq

Hi David,

I have added the cssStyle on my code and add the condition on my target column and it works like a charm. Thank you for your help.

Regards, Afieq

Hi,

I encounter new issue right now, after im implement the condition n the "td" function. Some of the rows not display the correct color. Instead of green it show in red color for the value of Column 2023 is more than Column 2022. Same for the Column Month, instead of green is display red when current month is more than previous month. Is there a solution for my problem?

Below is the result of my DataTables report and the coding.

'td' => function($row, $colName) use ($currentYear,$previousYear,$currentMonth,$previousMonth){
                    if($colName === $currentYear && $row[$currentYear] > $row[$previousYear]) {
                        return 'color: green;';
                    }
                    else if ($colName === $currentYear && $row[$currentYear] < $row[$previousYear]){
                        return  'color: red';
                    }
                    else if($colName === $currentMonth && $row[$currentMonth] > $row[$previousMonth]) {
                        return 'color: green;';
                    }
                    else if ($colName === $currentMonth && $row[$currentMonth] < $row[$previousMonth]){
                        return  'color: red';
                    }
                    else {
                        'color: black';
                    }
                },

Thanks in advance.

Regards, Afieq

Hi David,

I have added the var_dump and it's output as string for the column as you stated. I have convert the type to "num-fmt" and my condition color works. My report works fine but the value now is not separate thousand, how can i display my value with thousand separator?

"columnDefs" => array(
                    array( 
                        "type" => "num-fmt", 
                        "targets" => array(1) 
                    ), // set type for the 2nd column (index 1)
                    array( 
                        "type" => "num-fmt", 
                        "targets" => array(2) 
                    ),
                    array( 
                        "type" => "num-fmt", 
                        "targets" => array(3) 
                    ),
                    array( 
                        "type" => "num-fmt", 
                        "targets" => array(4) 
                    ),
                ),

Thanks in advance.

Regards, Afieq

Hi,

Any help can i get on this problem? I need to format the value using the comma separate thousand and align it to right.

Thanks in advance.

Regards, Afieq

Hi David,

As per mention before, when i use the "Number" type my condition color set will not work properly. That's why i'm using "num-fmt" type then my condition color will work fine but there's no thousand separator when using it.

May i know how can i set the thousand separator on the num-fmt type format?

Regards, Afieq

Did you try this?

						 "amount"=>array(
							 "type"=>"number",
							 "thousandSeparator"=>".",

Hi John,

I'm not using the number type, i'm using the num-fmt format for my condtion to works.

Regards, Afieq

Hi Afieq, I didn't notice this. I would try to format it via mysql, e.g. format() function

Use this, i tested it and it's ok:

					 "formatValue"=>function($value){
						return number_format($value,2,',','.');
							},

Hi John,

I have tried your suggestion but occur some error on my end but thanks for you help. It's okay, i have found another solution by changing from 'num-fmt' to 'number' type and modify my codes for set color by using str_replace and floatval on the row value. Then i achieve my objective to have thousand separator and color font on my datatables. Thanks.

'td' => function($row, $colName) use ($currentYear,$previousYear,$currentMonth,$previousMonth){
                    if($colName == $currentYear) {
                        if(floatval(str_replace(',', '', $row[$currentYear])) > floatval(str_replace(',', '', $row[$previousYear]))) {
                            return 'color: green;';
                        }
                        else if(floatval(str_replace(',', '', $row[$currentYear])) < floatval(str_replace(',', '', $row[$previousYear]))) {
                            return  'color: red';
                        }
                        else {
                            'color: black';
                        }
                    }
                    else if($colName == $currentMonth) {
                        if(floatval(str_replace(',', '', $row[$currentMonth])) > floatval(str_replace(',', '', $row[$previousMonth]))) {
                            return 'color: green;';
                        }
                        else if(floatval(str_replace(',', '', $row[$currentMonth])) < floatval(str_replace(',', '', $row[$previousMonth]))) {
                            return  'color: red';
                        }
                        else {
                            'color: black';
                        }

                    }
                    else {
                        'color: black';
                    }
                },

Regards, Afieq