CODEWITHSUNDEEP
javascriptjqueryjquery-pluginskeyboard-shortcuts
Rajesh Shanmugam
Rajesh Shanmugam

Reputation: 157

Javascript Dynamically invoke shortcut keys combination function to shortcutjs plugin

Am getting key Combination from the server. Based on that am assigning key Combination to function dynamically. The below code is working for last iteration in loop. how below code is work for all iterations.

In my page i have two buttons save and cancel the below code is working for last iteration in for loop, It means btnCanel button triggers if i press key for save function.Any suggestions. hope understand my question.

$(document).ready(function fn() {
var keyCombination = new Object();
        keyCombination['btnAdd'] = "Alt+S";
        keyCombination['btnCancel'] = "Alt+C";

        for (var k in keyCombination) {
            if (keyCombination.hasOwnProperty(k)) {
                shortcut.add(String(keyCombination[k]), function () {
                    var btnAdd = document.getElementById(String(k));
                    btnAdd.focus();
                    btnAdd.click();
                });
            }
        }
});

if i give like this means it is working

shortcut.add("Alt+S", function () {
  var btnAdd = document.getElementById('btnAdd ');
  btnAdd .focus();
  btnAdd .click();
  });

shortcut.add("Alt+C", function () {
  var btnCancel = document.getElementById('btnCancel');
  btnCancel.focus();
  btnCancel.click();
  });

but if i try to add dynamically its overriding help me this issue.

Thanks in Advance.

Upvotes: 2

Views: 488

Answers (2)

Tornike Shavishvili
Tornike Shavishvili

Reputation: 1354

Try this:

var keyCombinations = [ "Ctrl+Shift+X" , "Ctrl+Shift+Y" ];

for(var i=0; i<keyCombinations.length; i++){

  (function(shorcutCombination){
     shortcut.add(shorcutCombination,function() {
    alert("i am " + shorcutCombination);
     });
  })(keyCombinations[i]);

}

The idea is that you need to preserve the value of keyCombinations[i] as i increases in the loop. Tested this here: Openjs

Upvotes: 1

Rajesh Shanmugam
Rajesh Shanmugam

Reputation: 157

I created a separate function outside the document.ready function like this now its working fine.

$(document).ready(function fn() {
var keyCombination = new Object();
    keyCombination['btnAdd'] = "Alt+S";
    keyCombination['btnCancel'] = "Alt+C";
    for (var k in keyCombination) {
        if (keyCombination.hasOwnProperty(k)) {
            Set_KeyCombinations(k, keyCombination);
        }
    }
});

function Set_KeyCombinations(k, keyCombination) {
    shortcut.add(String(keyCombination[k]), function () {
        var eleId = document.getElementById(String(k));
        if (eleId) {
            if ($('#' + String(k).trim()).css('display') !== 'none' && eleId.getAttribute("disabled") !== "disabled") {
                eleId.click();
                eleId.focus();
            }
        }
    });
}

Upvotes: 1

Related Questions