Skip to main content
BobDotS
Participating Frequently
March 6, 2021
Answered

Javascript - setting radio button values when visibility of panels toggled

  • March 6, 2021
  • 1 reply
  • 1233 views

I have a dialog which has two panels, each with a group containing radio buttons :

 

dlgPrefs.pnlControls1.grpOptions.rbt1
dlgPrefs.pnlControls1.grpOptions.rbt2
dlgPrefs.pnlControls1.grpOptions.rbt3

 

dlgPrefs.pnlControls2.grpOptions.rbt1
dlgPrefs.pnlControls2.grpOptions.rbt2
dlgPrefs.pnlControls2.grpOptions.rbt3

dlgPrefs.pnlControls2.grpOptions.rbt4
dlgPrefs.pnlControls2.grpOptions.rbt5

 

I use another button to 'toggle' the visibility of the two panels :

 

dlgPrefs.btnToggleVis.onClick = function() {

     if (dlgPrefs.pnlControls1.visible) {
          dlgPrefs.pnlControls1.visible = false;
          dlgPrefs.pnlControls2.visible = true;
          dlgPrefs.pnlControls2.grpOptions.rbt4.value = true; // default when pnlControls2 is visible
     } else {
          dlgPrefs.pnlControls1.visible = true;
          dlgPrefs.pnlControls1.visible = false;
          dlgPrefs.pnlControls1.grpOptions.rbt3.value = true; // default when pnlControls1 is visible
     };

};

 

When I toggle the visibility of the panels I want to 'set' a radio button to be 'on' in the newly visible panel (in the example above it is rbt4 if pnlControls2 is visible, or rbt3 if pnlControls1 is visible).

My problem is that no matter what I've tried, whenever the visibility toggles I always get the last values that were manually set by the user (ie last clicked remains 'on').

 

Any advice would be greatly appreciated, following which you will probably hear me loudly going 'Doh!' from afar.

PS I've hunted high and low for a solution online and in these forums and read the Photoshop Scripting Guide and Photoshop Javascript Reference from start to finish. If anyone can recommend other resources that are more appropriate/comprehensive I'd appreciate that info too!

This topic has been closed for replies.
Correct answer jazz-y

dlgPrefs.pnlControls1.visible = true;
dlgPrefs.pnlControls1.visible = false;

???

 

Most likely the problem is in the code that you have not posted. How do you create dialog?

 

#target photoshop

var dlgPrefs = new Window("dialog");
dlgPrefs.pnlControls1 = dlgPrefs.add("panel");
dlgPrefs.pnlControls1.grpOptions = dlgPrefs.pnlControls1.add("group");
dlgPrefs.pnlControls1.grpOptions.rbt1 = dlgPrefs.pnlControls1.grpOptions.add("radiobutton");
dlgPrefs.pnlControls1.grpOptions.rbt2 = dlgPrefs.pnlControls1.grpOptions.add("radiobutton");
dlgPrefs.pnlControls1.grpOptions.rbt3 = dlgPrefs.pnlControls1.grpOptions.add("radiobutton");

dlgPrefs.pnlControls2 = dlgPrefs.add("panel");
dlgPrefs.pnlControls2.grpOptions = dlgPrefs.pnlControls2.add("group");
dlgPrefs.pnlControls2.grpOptions.rbt1 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");
dlgPrefs.pnlControls2.grpOptions.rbt2 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");
dlgPrefs.pnlControls2.grpOptions.rbt3 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");
dlgPrefs.pnlControls2.grpOptions.rbt4 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");
dlgPrefs.pnlControls2.grpOptions.rbt5 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");

dlgPrefs.btnToggleVis = dlgPrefs.add("button{text:'Toggle vis'}");

dlgPrefs.btnToggleVis.onClick = function () {

    if (dlgPrefs.pnlControls1.visible) {
        dlgPrefs.pnlControls1.visible = false;
        dlgPrefs.pnlControls2.visible = true;
        dlgPrefs.pnlControls2.grpOptions.rbt4.value = true; // default when pnlControls2 is visible
    } else {
        dlgPrefs.pnlControls1.visible = true;
        dlgPrefs.pnlControls2.visible = false;
        dlgPrefs.pnlControls1.grpOptions.rbt3.value = true; // default when pnlControls1 is visible
    };

};

dlgPrefs.show();

 

P.S. it is better to use a separate object or variables to store interface elements - it is easier to access them and there will be less confusion.

 

#target photoshop

var dlgPrefs = new Window("dialog"),
pnlControls1 = dlgPrefs.add("panel");
grpOptions1 = pnlControls1.add("group"),
rbt11 = grpOptions1.add("radiobutton"),
rbt12 = grpOptions1.add("radiobutton"),
rbt13 = grpOptions1.add("radiobutton"),

pnlControls2 = dlgPrefs.add("panel"),
grpOptions2 = pnlControls2.add("group"),
rbt21 = grpOptions2.add("radiobutton"),
rbt22 = grpOptions2.add("radiobutton"),
rbt23 = grpOptions2.add("radiobutton"),
rbt24 = grpOptions2.add("radiobutton"),
rbt25 = grpOptions2.add("radiobutton"),

btnToggleVis = dlgPrefs.add("button{text:'Toggle vis'}");

btnToggleVis.onClick = function () {
    if (pnlControls1.visible) {
        pnlControls1.visible = false;
        pnlControls2.visible = true;
        rbt24.value = true; // default when pnlControls2 is visible
    } else {
        pnlControls1.visible = true;
        pnlControls2.visible = false;
        rbt13.value = true; // default when pnlControls1 is visible
    };
};

dlgPrefs.show();

 

 

1 reply

jazz-yCorrect answer
Legend
March 6, 2021

dlgPrefs.pnlControls1.visible = true;
dlgPrefs.pnlControls1.visible = false;

???

 

Most likely the problem is in the code that you have not posted. How do you create dialog?

 

#target photoshop

var dlgPrefs = new Window("dialog");
dlgPrefs.pnlControls1 = dlgPrefs.add("panel");
dlgPrefs.pnlControls1.grpOptions = dlgPrefs.pnlControls1.add("group");
dlgPrefs.pnlControls1.grpOptions.rbt1 = dlgPrefs.pnlControls1.grpOptions.add("radiobutton");
dlgPrefs.pnlControls1.grpOptions.rbt2 = dlgPrefs.pnlControls1.grpOptions.add("radiobutton");
dlgPrefs.pnlControls1.grpOptions.rbt3 = dlgPrefs.pnlControls1.grpOptions.add("radiobutton");

dlgPrefs.pnlControls2 = dlgPrefs.add("panel");
dlgPrefs.pnlControls2.grpOptions = dlgPrefs.pnlControls2.add("group");
dlgPrefs.pnlControls2.grpOptions.rbt1 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");
dlgPrefs.pnlControls2.grpOptions.rbt2 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");
dlgPrefs.pnlControls2.grpOptions.rbt3 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");
dlgPrefs.pnlControls2.grpOptions.rbt4 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");
dlgPrefs.pnlControls2.grpOptions.rbt5 = dlgPrefs.pnlControls2.grpOptions.add("radiobutton");

dlgPrefs.btnToggleVis = dlgPrefs.add("button{text:'Toggle vis'}");

dlgPrefs.btnToggleVis.onClick = function () {

    if (dlgPrefs.pnlControls1.visible) {
        dlgPrefs.pnlControls1.visible = false;
        dlgPrefs.pnlControls2.visible = true;
        dlgPrefs.pnlControls2.grpOptions.rbt4.value = true; // default when pnlControls2 is visible
    } else {
        dlgPrefs.pnlControls1.visible = true;
        dlgPrefs.pnlControls2.visible = false;
        dlgPrefs.pnlControls1.grpOptions.rbt3.value = true; // default when pnlControls1 is visible
    };

};

dlgPrefs.show();

 

P.S. it is better to use a separate object or variables to store interface elements - it is easier to access them and there will be less confusion.

 

#target photoshop

var dlgPrefs = new Window("dialog"),
pnlControls1 = dlgPrefs.add("panel");
grpOptions1 = pnlControls1.add("group"),
rbt11 = grpOptions1.add("radiobutton"),
rbt12 = grpOptions1.add("radiobutton"),
rbt13 = grpOptions1.add("radiobutton"),

pnlControls2 = dlgPrefs.add("panel"),
grpOptions2 = pnlControls2.add("group"),
rbt21 = grpOptions2.add("radiobutton"),
rbt22 = grpOptions2.add("radiobutton"),
rbt23 = grpOptions2.add("radiobutton"),
rbt24 = grpOptions2.add("radiobutton"),
rbt25 = grpOptions2.add("radiobutton"),

btnToggleVis = dlgPrefs.add("button{text:'Toggle vis'}");

btnToggleVis.onClick = function () {
    if (pnlControls1.visible) {
        pnlControls1.visible = false;
        pnlControls2.visible = true;
        rbt24.value = true; // default when pnlControls2 is visible
    } else {
        pnlControls1.visible = true;
        pnlControls2.visible = false;
        rbt13.value = true; // default when pnlControls1 is visible
    };
};

dlgPrefs.show();

 

 

BobDotS
BobDotSAuthor
Participating Frequently
March 6, 2021

Thanks jazz-y, I like the way you have used objects to store the interface elements - it makes such good sense but I was not really aware that this was possible. I had some 'confused' ideas but until now the ability to do this in JS was not really clear to me. I like the way it simplifies the 'readability' of the code and will now go back and clean up my existing work.

 

I've tested your code and it exhibits exactly the behaviour that I want (and expected of my own code 😛 ). I hope that cleaning up my own work will fix some hard to track error that I've introduced. On the last part of the original post I also asked if there were any decent/good reference works that you could recommend? At the moment I am struggling along with books targetted at JS integration with browsers - nothing specific for Photoshop...

 

Thanks again for the assistance and pointers - they are truly appreciated as they relieve the frustration of going around in circles. Cheers!