Script to disable and enable compos with "READONLY" from a Checkbox

Question

Script to disable and enable compos with "READONLY" from a Checkbox

Navigation

#1 by (1 votes)

0

I need a script that will enable and disable a field with READONLY from a checkbox I do not know how to program in javascript, how do I script this

    <input readonly="" type="text" name="xx" value=""
    <input readonly="" type="text" name="xx" value=""
    <input readonly="" type="text" name="xx" value="" 
    Editar:<input type="checkbox" name="check" value="sim" />
    <input type="submit" value="Salvar Dados" /></p>

So if checked checkbox releases all fields for editing

javascript

asked by anonymous 04.06.2016 / 22:00

1 answer

Problem in android build of ionic "Failed to find 'ANDROID_HOME' environment variable" Inserting Multiple Models into a Yii2 Form

score 1 · Accepted Answer

You can do this:

Example:

var editar = document.getElementById("editar");


// No click verifico se o editar esta marcado e desativo os 
// readOnly dos inputs type text
editar.addEventListener("click", function() {
  if (this.checked) {
    toggleReadOnly(false);
  } else {
    toggleReadOnly(true);
  }
});

// Percorro  os elementos inputs type text e habilito/desabilito
function toggleReadOnly(bool) {
  var inputs = document.getElementsByTagName("input");
  for (var i = 0; i < inputs.length; i++) {
    if (inputs[i].type === "text") {
      inputs[i].readOnly = bool;
    }
  }
}

input[type=text]:-moz-read-only {
  background-color: #dddddd;
}
input[type=text]:read-only {
  background-color: #dddddd;
}

<input readonly="" type="text" name="xx" value="">
<input readonly="" type="text" name="xx" value="">
<input readonly="" type="text" name="xx" value="">
<label for="editar">Editar:</label>
<input type="checkbox" name="check" value="sim" id="editar" />
<input type="submit" value="Salvar Dados" />