able inputs after disabled-CodePudding

I want to able all this group of disabled inputs when clicking on <button class="btn_modifier">MODIFIER</button>. See below my inputs:

        if (element.choix_type == "1") {
            content1  =
                `<tr>
                <div class="show">
            <td><input type="text" class="input_stock" value="${element.nom}" disabled /></td>
            <td><input type="text" class="input_stock" value="${element.quantite}" disabled /></td>
            <td><input type="number" class="input_stock" value="${element.prix_achat_ht}" disabled /></td>
            <td><input type="number" class="input_stock" value="${element.prix_vente_ht}" disabled /></td>
            <td><input type="number" class="input_stock" value="${element.marge_ht = element.prix_vente_ht - element.prix_achat_ht}" disabled /></td>
            <td><input type="number" class="input_stock" value="${element.prix_ttc = element.prix_vente_ht * 1.2}" disabled /></td>
            <td><input type="text" class="input_stock" value="${element.degre}" disabled  /></td>
            <td>
            </div>
                <div class=btn_div>
                    <button class="btn_modifier">MODIFIER</button>
                    <button class="btn_delete">X</button>
                </div>
            </td>
            </tr>`
            ba.innerHTML = content1;

        }```

    

   
I already try this : 
`
    let modifier = document.querySelector(".btn_modifier");
    let able = document.querySelector(".input_stock");
    modifier.addEventListener("click", function () {
        able.disable = false;
    })`

CodePudding user response：

You should use document.querySelectorAll to get all elements with the class input_stock (or getElementsByClassName), and enable each one of them using a loop:

const inputs = document.querySelectorAll('.input_stock');
for (const input of inputs) {
    input.disabled = false;
}

CodePudding user response：

let modifier = document.querySelector(".btn_modifier");

modifier.addEventListener("click", function () {
  let able = document.querySelectorAll(".input_stock");
  // converts NodeList to Array
  [...able].forEach(a => a.disabled = false);
})