Return to Answer

Made changes to the answer to disable other elements.

edited Aug 12, 2022 at 7:05

onclick and onfocus events won't work when the button is disabled. However, you can add the event to the element that holds it.

For example, here is the HTML:

<table> <tr> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid1" disabled> </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid2" disabled> </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid3" disabled> </td> </tr> </table>

and here's the Javascript.

function tdclicked(td) { for (var i = 0; i < document.getElementsByClassName("form-control").length; i++) { document.getElementsByClassName("form-control")[i].setAttribute("disabled", "true"); } inputField = td.children[0]; inputField.removeAttribute("disabled"); }

onclick and onfocus events won't work when the button is disabled. However, you can add the event to the element that holds it.

For example, here is the HTML:

<table> <tr> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid1" disabled> </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid2" disabled> </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid3" disabled> </td> </tr> </table>

and here's the Javascript.

function tdclicked(td) { inputField = td.children[0]; inputField.removeAttribute("disabled"); }

onclick and onfocus events won't work when the button is disabled. However, you can add the event to the element that holds it.

For example, here is the HTML:

<table> <tr> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid1" disabled> </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid2" disabled> </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid3" disabled> </td> </tr> </table>

and here's the Javascript.

function tdclicked(td) { for (var i = 0; i < document.getElementsByClassName("form-control").length; i++) { document.getElementsByClassName("form-control")[i].setAttribute("disabled", "true"); } inputField = td.children[0]; inputField.removeAttribute("disabled"); }

Made changes to the answer because of changes to the question.

Source Link

edited Aug 12, 2022 at 6:19

Dustcloth

onclick and onfocus events won't work when the button is disabled. However, you can add the event to the element that holds it.

For example, here is the HTML:

<table> <tr> <td onclick = "buttonclicked"tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid"id="gradeid1" disabled> </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid2" disabled>  </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid3" disabled> </td> </tr> </table>

and here's the Javascript.

function buttonclickedtdclicked(td) { const inputField = documenttd.getElementById("gradeid");children[0]; inputField.removeAttribute("disabled"); }

onclick and onfocus events won't work when the button is disabled. However, you can add the event to the element that holds it.

For example, here is the HTML:

<table> <tr> <td onclick = "buttonclicked()"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid" disabled> </td> </tr> </table>

and here's the Javascript.

function buttonclicked() { const inputField = document.getElementById("gradeid"); inputField.removeAttribute("disabled"); }

onclick and onfocus events won't work when the button is disabled. However, you can add the event to the element that holds it.

For example, here is the HTML:

<table> <tr> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid1" disabled> </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid2" disabled>  </td> <td onclick = "tdclicked(this)"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid3" disabled> </td> </tr> </table>

and here's the Javascript.

function tdclicked(td) { inputField = td.children[0]; inputField.removeAttribute("disabled"); }

Source Link

answered Aug 12, 2022 at 6:05

Dustcloth

onclick and onfocus events won't work when the button is disabled. However, you can add the event to the element that holds it.

For example, here is the HTML:

<table> <tr> <td onclick = "buttonclicked()"> <input type="text" class="form-control" value="<?php echo $grade['grade'] ?>" id="gradeid" disabled> </td> </tr> </table>

and here's the Javascript.

function buttonclicked() { const inputField = document.getElementById("gradeid"); inputField.removeAttribute("disabled"); }

Collectives™ on Stack Overflow

Return to Answer