Skip to main content
Participant
December 1, 2020
Answered

Javascript for checkboxes and text fields

  • December 1, 2020
  • 4 replies
  • 838 views

Hello,

 

I have 6 checkboxes that I want to determine the fill color of certain text fields. 

 

When I check the checkboxes, I want the text field that is to the right of the check box and the text fields under New Part Number, REF. P/N, and Desription to all be filled green as shown below.

 

Now if I uncheck one of the checkboxes, I want ONLY the text field to the right of the unchecked box to fill transparent as shown below

 

With the code that I am running now, I run into the issue of the text fields under New Part Number, REF. P/N, and Desription to also turn transparent when I uncheck one of the boxes as shown below

 

I want all of the text fields to turn transparent ONLY when ALL of the checkboxes are unchecked as shown below

 

This is the code that I am running in the mouse up in each checkbox (red if/else changes based on the text field that it is next to):

 

if(event.target.value != "Off")

this.getField("PN1-4").fillColor = color.green;

else

this.getField("PN1-4").fillColor = color.transparent;

if(event.target.value != "Off")

this.getField("PN1-1").fillColor = color.green;

else

this.getField("PN1-1").fillColor = color.transparent;

if(event.target.value != "Off")

this.getField("PN1-2").fillColor = color.green;

else

this.getField("PN1-2").fillColor = color.transparent;

if(event.target.value != "Off")

this.getField("PN1-3").fillColor = color.green;

else

this.getField("PN1-3").fillColor = color.transparent;

This topic has been closed for replies.
Correct answer Nesa Nurani

You can try something like this for first checkbox and modify names for other checkboxes:

 

if(event.target.value != "Off"){
this.getField("PN1-4").fillColor = color.green;
this.getField("PN1-1").fillColor = color.green;
this.getField("PN1-2").fillColor = color.green;
this.getField("PN1-3").fillColor = color.green;}
else if(this.getField("Check Box1").value == "Off" && this.getField("Check Box2").value == "Off" && this.getField("Check Box3").value == "Off" && this.getField("Check Box4").value == "Off" && this.getField("Check Box5").value == "Off" && this.getField("Check Box6").value == "Off"){
this.getField("PN1-1").fillColor = color.transparent;
this.getField("PN1-2").fillColor = color.transparent;
this.getField("PN1-3").fillColor = color.transparent;
this.getField("PN1-4").fillColor = color.transparent;}
else if(event.target.value == "Off"){
this.getField("PN1-4").fillColor = color.transparent;}

 

4 replies

try67
Community Expert
Community Expert
December 1, 2020

So you placed the full code under one check-box, or just the red part? Can you share the file in question with us?

Nesa Nurani
Community Expert
Nesa NuraniCommunity ExpertCorrect answer
Community Expert
December 1, 2020

You can try something like this for first checkbox and modify names for other checkboxes:

 

if(event.target.value != "Off"){
this.getField("PN1-4").fillColor = color.green;
this.getField("PN1-1").fillColor = color.green;
this.getField("PN1-2").fillColor = color.green;
this.getField("PN1-3").fillColor = color.green;}
else if(this.getField("Check Box1").value == "Off" && this.getField("Check Box2").value == "Off" && this.getField("Check Box3").value == "Off" && this.getField("Check Box4").value == "Off" && this.getField("Check Box5").value == "Off" && this.getField("Check Box6").value == "Off"){
this.getField("PN1-1").fillColor = color.transparent;
this.getField("PN1-2").fillColor = color.transparent;
this.getField("PN1-3").fillColor = color.transparent;
this.getField("PN1-4").fillColor = color.transparent;}
else if(event.target.value == "Off"){
this.getField("PN1-4").fillColor = color.transparent;}

 

Bernd Alheit
Community Expert
Community Expert
December 1, 2020

Where does you change the fill color of the fields under New Part Number, REF. P/N, and Desription?

BarlaeDC
Community Expert
Community Expert
December 1, 2020

Hi,

 

You need to add checks for all the other in the else part (so the code in PN1-4) would be something like

 

if(event.target.value != "Off") {
this.getField("PN1-4").fillColor = color.green;
this.getField("PN1-1").fillColor = color.green;
this.getField("PN1-2").fillColor = color.green;
this.getField("PN1-3").fillColor = color.green;
}
else if ( this.getField("PN1-5").value == "off" && this.getFIeld("PN1-6").value == "off" && this.getField("PN1-7").value == "off" && this.getFIeld("PN1-8").value == "off" &&
this.getField("PN1-5").value == "off" ) { 
this.getField("PN1-4").fillColor = color.transparent;
this.getField("PN1-1").fillColor = color.transparent;
this.getField("PN1-2").fillColor = color.transparent;
this.getField("PN1-3").fillColor = color.transparent;
}

 

I haven't been able to check this, but that should be a good starting point, you want to check all the fields in your checkbox area to make sure none of the are checked, if any are checked then you leave the colour.

 

This could be moved to a document level script to save coding so much, let me know if that would help. If you could share the document for this, then I can make the changes and get it back to you.

 

Hope this helps

 

Malcolm