I'm trying to change some label text depending on the state of a checkbox for Photoshop Script UI. Only it's not updating at all. No idea why.
Ideally I'd like it to say "Some text" when ticked and "Some other text" when left unchecked. And change dynamically.
Here's my code
// DIALOG
// ======
var dlg = new Window("dialog");
dlg.text = "Title";
dlg.preferredSize.width = 180;
dlg.preferredSize.height = 100;
dlg.orientation = "column";
dlg.alignChildren = ["center","top"];
dlg.spacing = 10;
dlg.margins = 16;
var statictext1 = dlg.add("statictext", undefined, undefined, {name: "statictext1"});
statictext1.text = "Some static text";
statictext1.justify = "center";
var checkbox1 = dlg.add("checkbox", undefined, undefined, {name: "checkbox1"});
checkbox1.text = "Some text";
checkbox1.value = true;
// GROUP1
// ======
var group1 = dlg.add("group", undefined, {name: "group1"});
group1.orientation = "row";
group1.alignChildren = ["left","center"];
group1.spacing = 10;
group1.margins = 0;
// add buttons
group1.add ("button", undefined, "OK");
group1.add ("button", undefined, "Cancel");
// Define behavior for when the slider value changes
dlg.checkbox1.onChanging = function()
{
var textArr = ["Some text", "Some other text"]
var val = dlg.checkbox1.value;
// Update the label text with the current checkbox value.
dlg.checkbox1.text = textArr[val];
}
var myReturn = dlg.show();
The Checkbox
control fires the onClick
event and not the onChanging
event.
The only controls that fire the onChanging
event are:
EditText
Scrollbar
Slider
Therefore consider changing this part in your script:
// Define behavior for when the slider value changes
dlg.checkbox1.onChanging = function() {
// ...
}
to the following instead:
// Define behavior for when the checkbox value changes
dlg.checkbox1.onClick = function() {
var textArr = ["Some text", "Some other text"]
var val = checkbox1.value ? textArr[0] : textArr[1];
statictext1.text = val;
}
In the body of the preceding function for the onClick
event, i.e. the part that reads;
var val = checkbox1.value ? textArr[0] : textArr[1];
we utilize the conditional (ternary) operator to check the value
property of checkbox1
. If checkbox1
is checked (true) we assign the string "Some text"
to the val
variable, otherwise if checkbox1
is unchecked (false) we assign the string "Some other text"
to the val
variable instead.
The following changes also need to be carried out:
As checkbox1
's initial value
is set to true
, i.e. it's checked, you'll need to change line number 13 from this:
statictext1.text = "Some static text";
to this:
statictext1.text = "Some text";
Also consider setting the size
property for statictext1
. As you can see on line number 15 below the following has been added:
statictext1.size = [180, 20];
This will ensure it's width accomodates the "Some other text"
string.
Here is the full revised script:
// DIALOG
// ======
var dlg = new Window("dialog");
dlg.text = "Title";
dlg.preferredSize.width = 180;
dlg.preferredSize.height = 100;
dlg.orientation = "column";
dlg.alignChildren = ["center","top"];
dlg.spacing = 10;
dlg.margins = 16;
var statictext1 = dlg.add("statictext", undefined, undefined, {name: "statictext1"});
statictext1.text = "Some text"; // <--- Note: Also change this !
statictext1.justify = "center";
statictext1.size = [180, 20]; // <--- Note: Also set the width/height !
var checkbox1 = dlg.add("checkbox", undefined, undefined, {name: "checkbox1"});
checkbox1.text = "Some text";
checkbox1.value = true;
// GROUP1
// ======
var group1 = dlg.add("group", undefined, {name: "group1"});
group1.orientation = "row";
group1.alignChildren = ["left","center"];
group1.spacing = 10;
group1.margins = 0;
// add buttons
group1.add ("button", undefined, "OK");
group1.add ("button", undefined, "Cancel");
// Define behavior for when the checkbox value changes
dlg.checkbox1.onClick = function() {
var textArr = ["Some text", "Some other text"]
var val = checkbox1.value ? textArr[0] : textArr[1];
statictext1.text = val;
}
var myReturn = dlg.show();