Javascript UI Button onClick with ALT-key pressed

[Parts4Arts]

Hello all,
I would like to detect in a user interface when a button is pressed whether the Alt key was pressed at the same time. So onClick or onClick+Alt.
In an input field you can detect keys with addEventListener("keydown"...).
But how do I do that with a button?

Here is my test javascript which does not work for the "OK" button.

var vXX = ""; // for protocol
var w = new Window("dialog");
var inputField = w.add("edittext", undefined, ""); inputField.characters = 20;
var btnGroup = w.add("group");
var cancelButton = btnGroup.add("button", undefined, "Cancel");
var submitButton = btnGroup.add("button", undefined, "Submit");

cancelButton.onClick = function () { vXX += "\n" + "Cancle"; w.close(); }
submitButton.onClick = function () {
  submitButton.addEventListener("keydown", function (k) {
    if (k.keyName === "Alt") { vXX += "\n" + "onClick OK ALT"; } // don't work
  } )
  vXX += "\n" + "OK"; w.close();
}
inputField.addEventListener("keydown", function (k) {
  if (k.keyName === "Alt") { vXX += "\n" + "Input ALT"; } // it works
} )
submitButton.addEventListener("keydown", function (k) {
  if (k.keyName === "Alt") { vXX += "\n" + "OK ALT"; } // don't work
} )

w.show();
alert(vXX);

Looking forward to your answers
- j.

[m1b]

var altKeyPressed = k.altKey

It's only "k" because your event is passed in the k argument. It's more common to use "ev" or "e", but doesn't matter.

- Mark 

[Parts4Arts]

Hi Mark,

thanks for the quick answer. But I don't understand how to use your tip.

I've change my script. The problem is still there. The submitButton.addEventListener("keydown", function (k) {...} is not triggered with a "keydown". May be that's the problem?

// Version 2
var vXX = ""; // for protocol
var w = new Window("dialog");
var inputField = w.add("edittext", undefined, ""); inputField.characters = 20;
var btnGroup = w.add("group");
var cancelButton = btnGroup.add("button", undefined, "Cancel");
var submitButton = btnGroup.add("button", undefined, "Submit");

cancelButton.onClick = function () { vXX += "\n" + "Cancle"; w.close(); }
submitButton.onClick = function () {
  submitButton.addEventListener("keydown", function (k) {
    if (k.keyName === "Alt") { vXX += "\n" + "onClick OK ALT"; } // don't work
  } )
  vXX += "\n" + "OK"; w.close();
}
inputField.addEventListener("keydown", function (k) {
var altKeyPressed = k.altKey;
  if (altKeyPressed) { vXX += "\n" + altKeyPressed + " " + k.keyName + " " + "Input ALT"; } // it works
} )
submitButton.addEventListener("keydown", function (k) {
  var altKeyPressed = k.altKey;
  vXX += "\n" + k.altKey + " " + k.keyName + " " + "in OK-button";
  if (altKeyPressed) { vXX += "\n" + k.altKey + " " + k.keyName + " " + "OK ALT"; } // don't work
} )

w.show();
alert(vXX);

[femkeblanco · Accepted solution]

var w1 = new Window("dialog");
    var button1 = w1.add("button", undefined, "text");
    var doSomething = function (k) {
        if (k.altKey == true) {
            alert("Mouse clicked and Alt pressed.");
            w1.close();
        }
    }
    button1.addEventListener("click", doSomething);
w1.show();

[Parts4Arts]

Thak you very much, that works. 🙂

Have a good sunday.

– j.

[m1b]

Thanks @femkeblanco. 🙂  I didn't notice Parts4Arts had bound to the "keyDown" event and not the "click" event.

@Parts4Arts the problem is that I don't think buttons trigger the keyDown even.

- Mark

[CarlosCanto]

here's another version without eventListeners

var w1 = new Window("dialog");
var button1 = w1.add("button", undefined, "text");

button1.onClick = function() {
    if ( ScriptUI.environment.keyboardState.altKey ) {
        alert("Mouse clicked and Alt pressed.");
        w1.close();
    }
}

w1.show();

[MidoSemsem]

@CarlosCanto @femkeblanco Thank you.

This is perfect and works fine.

However, JSXBIN scripts don't work.

EXAMPLE:

var w1 = new Window("dialog");
var button1 = w1.add("button", undefined, "text");

button1.onClick = function() {
    if ( ScriptUI.environment.keyboardState.altKey ) {
@JSXBIN@ES@2.0@MyBbyBn0ABJAnAEjzFjBjMjFjSjUBfRBFegeiNjPjVjTjFhAjDjMjJjDjLjFjEhAj
BjOjEhAiBjMjUhAjQjSjFjTjTjFjEhOff0DzACByB
        w1.close();
    }
}

w1.show();

 Is there a solution?

[femkeblanco]

Sorry, I have never used JSXBIN. 

[m1b]

I'm not very knowledgeable on jsxbin but I think you have to eval, eg.

eval('@JSXBIN@ES@2.0@MyBbyBn0ABJAnAEjzFjBjMjFjSjUBfRBFegeiNjPjVjTjFhAjDjMjJjDjLjFjEhAjBjOjEhAiBjMjUhAjQjSjFjTjTjFjEhOff0DzACByB');

-Mark

[MidoSemsem]

Thank you @m1b . It works.