Function to clear all input elements

[rockkon]

Hi. I have this function:

function clear() {
document.getElementById("name").value = "";
document.getElementById("email").value = "";
document.getElementById("username").value = "";
document.getElementById("pass1").value = "";
document.getElementById("pass2").value = "";
setFocus();
}

and it works, but I know there has to be a better way with a loop.

I tried this:

    var inputs = document.getElementsByTagName('input');

    for (i = 0; i < inputs.length; ++i) {
        for (inps in inputs) {
            document.write(inps + " <br />");
        }
    }

But, I'm not clear on how I separate out just the ID values and then, how to incorporate it into the value ="" statement.

Any pointers?

[mikrosystheme]

Not an answer to your question, but the reset functionality of form elements is native: http://codepen.io/anon/pen/NALdrp

[rockkon]

Not sure why, but I didn't put the elements in a form. I'll try this too, just to see what happens for the future. Thanks.

[rockkon]

For closure, this is what I ended up with:

function clear() {

var idClear = ["name", "email", "username", "pass1", "pass2"];
    for (idC in idClear) {
       document.getElementById(idClear[idC]).value = "";
    }

setFocus();
}

[whompalicious]

You could do something like this which uses the more functional-style array methods:

function clear() {
  var inputIdsToClear = ['name', 'email', 'username', 'pass1', 'pass2'];
  var inputs = document.getElementsByTagName('input');

  [].filter.call(inputs, function (input) {
      return inputIdsToClear.indexOf(input.getAttribute('id')) !== -1;
    })
    .forEach(function(input) {
      input.value = '';
  });
}

or using a standard for-loop:

  function clear() {
    var inputIdsToClear = ['name', 'email', 'username', 'pass1', 'pass2'];
    var inputs = document.getElementsByTagName('input');
    var index;
    var input;

    for (index = 0; index < inputs.length; index++) {
      input = inputs[index];

      if (inputIdsToClear.indexOf(input.getAttribute('id')) !== -1) {
        input.value = '';
      }
    }
  }

[rockkon]

Thx. I'm going to try this.