difficulty using enter key as tab

Question

i'm creating forms and needed to use "enter key press as tab key" to focus next text fields and after completion of the form, button should be pressed.

my code works except for the button press part, it does nothing to the button.

thanks in advance...

$(window).load(function(){
      document.getElementById("Editbox1").focus();
function tab(e) {
    if (e.which == 13) {
        e.target.nextSibling.nextSibling.focus();
        e.preventDefault();
    }
}
var inputs = document.getElementsByTagName('input');
for (var x = 0; x < inputs.length; x++)
{
    var input = inputs[x];
    input.onkeypress = tab;
}


    });

Just code · Accepted Answer

You need to differentiate the button click by its id, you have two approaches

1st you can bind the enter function by using the length of the inputs, get last id and differentiate it.

$(window).load(function() {
  document.getElementById("Editbox1").focus();

  function tab(e) {
    if (e.which == 13) {
      console.log('test');
      e.target.nextSibling.nextSibling.focus();
      e.preventDefault();
    }
  }
  function submitForm(e) {
    if (e.which == 13) {     
      document.getElementByName("Form1").submit();
    }
  }
  var inputs = document.getElementsByTagName('input');
  for (var x = 0; x < inputs.length; x++) {
    var input = inputs[x];   
    if (x === (inputs.length - 1)) {    
      input.onkeypress = submitForm;
    } else {
      input.onkeypress = tab;
    }
  }

});

2nd one you can differentiate it using button id when enter is pressed.

 if (e.which == 13 && e.target.id !== "Button1") {

$(window).load(function() {
  document.getElementById("Editbox1").focus();

  function tab(e) {
    if (e.which == 13 && e.target.id !== "Button1") {
      console.log('test');
      e.target.nextSibling.nextSibling.focus();
      e.preventDefault();
    }else{
      alert('submit')
    }
  }

  var inputs = document.getElementsByTagName('input');
  for (var x = 0; x < inputs.length; x++) {
    var input = inputs[x];
    input.onkeypress = tab;
  }

});

difficulty using enter key as tab

Answers (1)

Related Questions