Page 1 of 1

color of the field

Posted: Tue Apr 14, 2020 11:14 pm
by kknm
I am a novice user of this wonderful product. Already learned a lot, but so far could not find the answer to the question of changing the color of the field on the browse form. The example for changing the color of a full line works fine for me, but in my project there are several fields in a line with values ​​falling in certain ranges. It is necessary to highlight the color of the field in violation of the range of values. In addition to changing the color, I would like to get an example of an optimal script for calculating these fields.
Sorry for my bad english

Re: color of the field

Posted: Wed Apr 15, 2020 12:18 am
by Janusz
Hi,
Maybe this can help:
https://forums.nubuilder.cloud/viewtopic. ... lit=+color

for the background color change of the specific field you can use ex.:
$('#nucell_1_1').css('background-color','red');

Re: color of the field

Posted: Wed Apr 15, 2020 8:05 am
by kev1n
kknm wrote:I would like to get an example of an optimal script for calculating these fields.
Hi,

Can you provide more information on what you are trying to do?

Re: color of the field

Posted: Wed Apr 15, 2020 9:05 pm
by kknm
I used this advice https://forums.nubuilder.cloud/viewtopic. ... lit=+color - the color of the entire line changes. If you substitute a specific column number( $("div[id^='nucell_"+ "0_4"+ "']").css("color", "red");), then it works correctly, only 1 field changes. The error is either in the rowNum variable or in the syntax.
My code:

Code: Select all

if (nuFormType() == 'browse') {
    $('[data-nu-column="4"]').each(function (index) {

        var cellId = $(this).attr('id');
        var cellValue = $('#' + cellId).html();
        var rowNum = String(cellId).split('_')[1];

        if (cellValue > '2.0') {
            $("div[id^='nucell_"+ rowNum + "']").css("color", "red");
        }
            else {
                $("div[id^='nucell_" + rowNum + "']").css("color", "black");
            }
    });
}

Re: color of the field

Posted: Wed Apr 15, 2020 9:25 pm
by kev1n
This code will change the color to red, if its value is greater than 2.

Code: Select all

$('[data-nu-column="4"]').each(function(index) {
	var color = Number($(this).html()) > 2 ? 'red' : 'black';
	$(this).css("color", color);
});

Re: color of the field

Posted: Wed Apr 15, 2020 9:55 pm
by kknm
kev1n wrote:This code will change the color to red, if its value is greater than 2.

Code: Select all

$('[data-nu-column="4"]').each(function(index) {
	var color = Number($(this).html()) > 2 ? 'red' : 'black';
	$(this).css("color", color);
});
Thank you - this is what you need! I hope that I can apply this to 5 more fields on the same line.
By the way, tell me

Code: Select all

 var color = 4 <Number ($ (this) .html ()) <12? 'red': 'black'; [/ code] is the correct expression?

Re: color of the field

Posted: Wed Apr 15, 2020 10:16 pm
by kev1n
To apply it to multiple columns:

Code: Select all

$('[data-nu-column="4"], [data-nu-column="5"] ').each(function(index) {
   var color = Number($(this).html()) > 2 ? 'red' : 'black';
   $(this).css("color", color);
});
I don't understand your other code. Can you describe it in words?

Re: color of the field

Posted: Wed Apr 15, 2020 10:25 pm
by kknm
kev1n wrote:To apply it to multiple columns:

Code: Select all

$('[data-nu-column="4"][data-nu-column="5"] ').each(function(index) {
   var color = Number($(this).html()) > 2 ? 'red' : 'black';
   $(this).css("color", color);
});
I don't understand your other code. Can you describe it in words?
field4 > 5
4 > field5 >14
35 > field6 > 75
95 < field7
field8 >5

Re: color of the field

Posted: Thu Apr 16, 2020 12:48 am
by kknm
kknm wrote:
kev1n wrote:To apply it to multiple columns:

Code: Select all

$('[data-nu-column="4"][data-nu-column="5"] ').each(function(index) {
   var color = Number($(this).html()) > 2 ? 'red' : 'black';
   $(this).css("color", color);
});
I don't understand your other code. Can you describe it in words?
field4 > 5
4 > field5 >14
35 > field6 > 75
95 < field7
field8 >5
I answer myself

Code: Select all

$('[data-nu-column="6"]').each(function(index) {
   var color = Number($(this).html()) > 75 ?  'red' : Number($(this).html()) < 35 ? 'red' : 'black' ;
   $(this).css("color", color);
});

Re: color of the field

Posted: Thu Apr 16, 2020 11:52 pm
by admin
nice work!