Welcome to the nuBuilder Forums!

Register and log in to access exclusive forums and content available only to registered users.

color of the field

Questions related to customising nuBuilder Forte with JavaScript or PHP.
Post Reply
kknm
Posts: 366
Joined: Sat Apr 11, 2020 12:03 am
Has thanked: 3 times
Been thanked: 4 times
Contact:

color of the field

Unread post 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
Janusz
nuBuilder Team
Posts: 506
Joined: Fri Dec 28, 2018 1:41 pm
Location: Krakow, Poland
Has thanked: 8 times
Been thanked: 18 times

Re: color of the field

Unread post 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');
If you like nuBuilder, please leave a review on SourceForge
kev1n
nuBuilder Team
Posts: 4305
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 446 times
Contact:

Re: color of the field

Unread post 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?
kknm
Posts: 366
Joined: Sat Apr 11, 2020 12:03 am
Has thanked: 3 times
Been thanked: 4 times
Contact:

Re: color of the field

Unread post 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");
            }
    });
}
kev1n
nuBuilder Team
Posts: 4305
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 446 times
Contact:

Re: color of the field

Unread post 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);
});
kknm
Posts: 366
Joined: Sat Apr 11, 2020 12:03 am
Has thanked: 3 times
Been thanked: 4 times
Contact:

Re: color of the field

Unread post 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?
kev1n
nuBuilder Team
Posts: 4305
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 446 times
Contact:

Re: color of the field

Unread post 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?
Last edited by kev1n on Thu Apr 16, 2020 6:24 pm, edited 1 time in total.
kknm
Posts: 366
Joined: Sat Apr 11, 2020 12:03 am
Has thanked: 3 times
Been thanked: 4 times
Contact:

Re: color of the field

Unread post 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
kknm
Posts: 366
Joined: Sat Apr 11, 2020 12:03 am
Has thanked: 3 times
Been thanked: 4 times
Contact:

Re: color of the field

Unread post 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);
});
admin
Site Admin
Posts: 2815
Joined: Mon Jun 15, 2009 2:23 am
Been thanked: 25 times

Re: color of the field

Unread post by admin »

nice work!
Post Reply