Avatar

Background color for details records.

NDC ELOG

Hi all, First of all, I thank you.plz help me.

Why in the Details page, I cannot fill the background color for that row if column [請求 済] has [済] value and the error it shows is as follows.

Follow 3 followers
0

8 comments

Avatar
Sean Tachibana 0 votes

Hi NDC,

From what I see in the processing, it looks like you're trying to color it using the event object,
but you can not use the information in the event object to change the decoration information.
It seems like you put the value in tablerecords and output it to the console, but it doesn't have the style information.
 
Therefore, you need to get the DOM information and color it in the same way as we change the progress information's text color.
 
Hopefully, this helps.
0
Comment actions Permalink
Avatar
NDC ELOG 0 votes

Hello Sean Tachibana,

I have only set the background color for position i of the vertical row, how can I color horizontally, according to the positions of the variables: elStatus1,elStatus2,elStatus3,...

0
Comment actions Permalink
Avatar
Yuzo Arai 1 vote

Hello NDC,

For rows, you need to set up class attributes to the tr elements.

Eg.
JavaScript File


case '1st row' :
el.rows[i].classList.add("first");

CSS File


.first {
background-color:#7AE1FF;
}
1
Comment actions Permalink
Avatar
NDC ELOG 0 votes

Hello Yuzo Arai,

Can you show me more how can i query for tr of table 1 (currently i have 4 tables for this page), i have tried but i don't know how to run.

Thanks you./..

0
Comment actions Permalink
Avatar
NDC ELOG 0 votes

Hello Yuzo Arai,

Here is the code I just tried again.

Thank you for your help.

0
Comment actions Permalink
Avatar
Sean Tachibana 0 votes

Hi NDC,

As Yuzo commented above, if you want to manipulate the lines together, the tr element is in the form of manipulation.

 

I'm not quite sure where you want me to explain in details, but you can change the background color of a row by processing it as follows.

 

Sample to make the background color of a row red

※Please set up jQuery as well.
 
(function($) {

"use strict";

kintone.events.on("app.record.detail.show", function(e) {



setTimeout(changeColor, 900);



});



function changeColor() {

var tr = $(kintone.app.record.getFieldElement('field code of the table')).find('tr');

$(tr[row number to be changed]).css('background-color', 'red');

}



})(jQuery);
 
If you make the "row number to be changed" part above as a variable and specify the row according to the other processing, will it be close to the desired processing?
 
Also, as for the elements, you don't have to get them with getFieldElement, but the app's DOM information is unknown, so I get it in this form.
 
The settimeout is simply waiting for the table to be described, so it depends on the app situation.
So the number 900 is not important.
0
Comment actions Permalink
Avatar
NDC ELOG 0 votes

Hi Sean Tachibana,

hi, i will try it after i do the more needed functions, thank you.

0
Comment actions Permalink
Avatar
NDC ELOG 0 votes

Hi Sean Tachibana, Yuzo Arai

i can do it, Thanks, you've been very kind.

 

0
Comment actions Permalink