Highlighted

Simultaneously check/uncheck two checkboxes with different names-always checked or unchecked together

Community Beginner ,
Jan 02, 2018

Copy link to clipboard

Copied

I have a form with two groups of related products and prices. When a user checks one product from the first group, I need it to automatically check the related product from the second group and display their prices if checked. They both need to uncheck together as well.

The checkboxes in the different product groups need different names because I am also showing/hiding related prices based on the checkbox being checked and a variable quantity.

My code doesn't quite work:

The code for the First Checkbox

  1. Displays the Price field when checkbox is checked, and
  2. Checks both boxes (First Checkbox + Matching Checkbox)
  3. but, it won't uncheck both boxes if one or the other is unchecked.

var nHide = event.target.isBoxChecked(0)?display.visible:display.hidden;

this.getField(“Price”).display = nHide;

if (event.target.value!="Off") this.getField(“Matching Checkbox”).checkThisBox(0, true);

Is it possible to get the checkboxes to check and uncheck together, just as if they had the same name?

Thanks for any assistance you can provide!

Adobe Community Professional
Correct answer by Thom_Parker | Adobe Community Professional

First, make sure all the check boxes use the same export value. At least all the check boxes that relate to one another should have the same export value.

Then use this code in the Mouse Up script of the parent product.

this.getField ("Matching Checkbox").value = event.target.value;

This will cause all of the related product check boxes to go on and off with the parent.

Topics

Acrobat SDK and JavaScript, Macintosh

Views

1.6K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Simultaneously check/uncheck two checkboxes with different names-always checked or unchecked together

Community Beginner ,
Jan 02, 2018

Copy link to clipboard

Copied

I have a form with two groups of related products and prices. When a user checks one product from the first group, I need it to automatically check the related product from the second group and display their prices if checked. They both need to uncheck together as well.

The checkboxes in the different product groups need different names because I am also showing/hiding related prices based on the checkbox being checked and a variable quantity.

My code doesn't quite work:

The code for the First Checkbox

  1. Displays the Price field when checkbox is checked, and
  2. Checks both boxes (First Checkbox + Matching Checkbox)
  3. but, it won't uncheck both boxes if one or the other is unchecked.

var nHide = event.target.isBoxChecked(0)?display.visible:display.hidden;

this.getField(“Price”).display = nHide;

if (event.target.value!="Off") this.getField(“Matching Checkbox”).checkThisBox(0, true);

Is it possible to get the checkboxes to check and uncheck together, just as if they had the same name?

Thanks for any assistance you can provide!

Adobe Community Professional
Correct answer by Thom_Parker | Adobe Community Professional

First, make sure all the check boxes use the same export value. At least all the check boxes that relate to one another should have the same export value.

Then use this code in the Mouse Up script of the parent product.

this.getField ("Matching Checkbox").value = event.target.value;

This will cause all of the related product check boxes to go on and off with the parent.

Topics

Acrobat SDK and JavaScript, Macintosh

Views

1.6K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Adobe Community Professional ,
Jan 02, 2018

Copy link to clipboard

Copied

First, make sure all the check boxes use the same export value. At least all the check boxes that relate to one another should have the same export value.

Then use this code in the Mouse Up script of the parent product.

this.getField ("Matching Checkbox").value = event.target.value;

This will cause all of the related product check boxes to go on and off with the parent.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jan 02, 2018

Copy link to clipboard

Copied

Thom,

Thanks for the reply. Your solution worked perfectly, but I see there's more to it than I first realized. (I am a rookie at Javavscript)

See my example. When I check/uncheck either Checkbox 1, they both check/uncheck in tandem as expected, and Extended Price 1 is hidden if unchecked, but Extended price 4 is still visible.

What is missing is I want to show/hide Extended price 1 AND Extended price 4 with the state of the checkboxes—Check=show/Uncheck=hide (and, same with the extended prices related to Checkboxes 2, 3, etc.)

Check/UncheckShow/Hide both group prices

Checkbox 1 (Group 1)

javascript:;

Extended price 1

Checkbox 2 (Group 1)

Extended price 2

Checkbox 3 (Group 1)

Extended price 3

Checkbox 1 (Group 2)

Extended price 4

Checkbox 2 (Group 2)

Extended price 5

Checkbox 3 (Group 2)

Extended price 6

Is that doable?

Thank you so much! And happy new year!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
Jan 02, 2018

Copy link to clipboard

Copied

It is all doable. So if I understand correctly, Price1 is hidden/shown with the checkbox1 in Group 1, Price 2 with Checkbox2 in group1, etc, price4 with checkbox1 in group2, price 5 with checkbox2 in group 2.

If this is correct, then price 1 and price 4 are best controlled from the mouseUp scripts on the checkbox 1 fields. Your original script will work for this. It just needs to be modified to hide/show the correct price field.

But you have a complication because the value of the child check boxes can come from 2 different sources, the parent and the child, so you need to repeat the show/hide code in both MouseUps.

For example, for goup 1, use this code in the Checkbox1 MouseUp

this.getField("Price1").display = (event.target.value=="Yes")?display.visible:display.hidden;

this.getField("Price2").display = (event.target.value=="Yes")?display.visible:display.hidden;

this.getField("Price3").display = (event.target.value=="Yes")?display.visible:display.hidden;

Then for the checkbox 2 add this code to the Mouse up

this.getField("Price2").display = (event.target.value=="Yes")?display.visible:display.hidden;

This is not an ideal or clean solution from a programming point of view, but it is straight forward and will work.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jan 02, 2018

Copy link to clipboard

Copied

Thom,

Thank you for your help on this, but I think something got lost in translation. My fault for not being crystal clear.

To clarify:

Checkbox 1 (Group 1 hardware)

Qty

Extended price 1

Checkbox 2 (Group 1 hardware)

Qty

Extended price 2

Checkbox 3 (Group 1 hardware)

Qty

Extended price 3

Checkbox 1a (Group 2 software)

Qty

Extended price 4

Checkbox 2a (Group 2 software)

Qty

Extended price 5

Checkbox 3a (Group 2 software)

Qty

Extended price 6

When either Checkbox 1 or 1a is checked, both checkboxes 1 and 1a get checked, and Extended prices 1 and 4 become visible

When either Checkbox 1 or 1a is unchecked, both checkboxes 1 and 1a get unchecked, and Extended prices 1 and 4 become hidden

When either Checkbox 2 or 2a is checked, both checkboxes 2 and 2a get checked, and Extended prices 2 and 5 become visible

When either Checkbox 2 or 2a is unchecked, both checkboxes 2 and 2a get unchecked, and Extended prices 2 and 5 become hidden

When either Checkbox 3 or 3a is checked, both checkboxes 3 and 3a get checked, and Extended prices 3 and 6 become visible

When either Checkbox 3 or 3a is unchecked, both checkboxes 3 and 3a get unchecked, and Extended prices 3 and 6 become hidden

and so on…

The idea is a customer must buy the software and hardware together, so if they check one, the other automatically is added to their purchase. There will also be a Quantity multiplier, but I think I can just factor the Extended price column.

Again, thank you, thank you, thank you Thom! I truly appreciate your expert help.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
Jan 02, 2018

Copy link to clipboard

Copied

I did not get that.  I thought you had a parent/child relationship.  However, this is easy enough to do. In fact you already have all the code you need to do it.

The visibility code is nearly identical in all cases. Just put in the lines of code that change the target fields for the mouse up in each checkbox. The only difference is the target field names.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jan 03, 2018

Copy link to clipboard

Copied

Thom,

My checkboxes are working great. But now there's a new wrinkle.

I need to total the Extended Price column in each group.

I did something similar in another form using a custom calculation (see below), but it's not working in this form.

Checkbox 1 (Group 1 hardware)

Qty

Extended price 1

Checkbox 2 (Group 1 hardware)

Qty

Extended price 2

Checkbox 3 (Group 1 hardware)

Qty

Extended price 3

Group 1 Price Total

Checkbox 1a (Group 2 software)

Qty

Extended price 4

Checkbox 2a (Group 2 software)

Qty

Extended price 5

Checkbox 3a (Group 2 software)

Qty

Extended price 6

Group 2 Price Total

Here's the script for my checkboxes:

this.getField("Extended price 1").display = (event.target.value=="Yes")?display.visible:display.hidden;

this.getField("Extended price 4").display = (event.target.value=="Yes")?display.visible:display.hidden;

this.getField ("Checkbox 1").value = event.target.value;

(and similar for Checkbox 2 etc. etc.)

And here's my custom calculation:

// Custom calculation script for Extended Total field

// Initialize variable

var sum = 0;

// Add first field value if its corresponding check box is selected

if (getField(“Checkbox 1”).value !== "Off") {

    sum += +getField(“Price 1_Ext").value;

}

// Add second field value if its corresponding check box is selected

if (getField(“Checkbox 2”).value !== "Off") {

    sum += +getField(“Price2_Ext").value;

}

// Repeat for other XX values

// Set this field value to the sum, or set to blank if zero

if (sum > 0) {

    event.value = sum;

} else {

    event.value = "";

}

Can you see why this custom calculation isn't working to sum the column? I don't have a clue…

Thanks again!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Jan 03, 2018

Copy link to clipboard

Copied

Check the JS Console for any error messages.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jan 03, 2018

Copy link to clipboard

Copied

No errors in the editor window…

Screen Shot 2018-01-03 at 3.44.58 PM.png

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Jan 03, 2018

Copy link to clipboard

Copied

The JS Editor is not the JS Console... Press Cmd+J to show the latter, after you make a change to the value of one of your fields.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
Jan 03, 2018

Copy link to clipboard

Copied

Here's a video on using the Console window, it's very useful.

The Acrobat JavaScript Console Window - YouTube

When I copy and paste your code I'm seeing illegal quote symbols in the "getField" input.  Probably because you copied the code from somewhere.  Delete these quotes and type them in manually.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Jan 03, 2018

Copy link to clipboard

Copied

If that was the case the code would have been rejected by the editor window. The original code must have the correct type of quotes.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
Jan 04, 2018

Copy link to clipboard

Copied

If that were true, then I would think all the quotes would be wrong when I copied it, but only the quotes inside the getField calls were wrong. The others were correct. But you know, copying and pasting between formatted systems can be problematic, so maybe the quotes aren't a real issue.

If David posts the console results we'll see if a syntax error is reported.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jan 05, 2018

Copy link to clipboard

Copied

Thom,

You're observation was correct—my quote marks were copied and pasted and invalid in a few places.

I truly appreciate your help—I am just a lowly designer and total hack with javascript, but I'm learning…

Thank you!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
New Here ,
Jun 22, 2020

Copy link to clipboard

Copied

Is there a way to uncheck all if they don't all have the same Export Value?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Tonja_R LATEST
New Here ,
Jun 22, 2020

Copy link to clipboard

Copied

I have 2 javascripts

1. 

var otherCheckBoxes = ["Checkbox1", "Checkbox2", "Checkbox3"]
if (getField("Select All_1").value!="off") {for (var i in otherCheckBoxes) getField(otherCheckBoxes[i]).checkThisBox(0,true);}

2.

var otherCheckBoxes = ["Checkbox1", "Checkbox2", "Checkbox3"]
if (getField("Select All_1").value!="Off") {for (var i in otherCheckBoxes) getField(otherCheckBoxes[i]).checkThisBox(0,false);}

 

But when parent box is checked all child boxes uncheck and when parent box is unchecked all child boxes check.  LOL

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Resources
One Stop Solution for Acrobat
Edit a PDF