JSFiddle - React, Tailwind, and code Playground

by roedema

HTML

<p>
    <input type="text" id="QR~QID14#1~1~TEXT" />
    <input type="checkbox" id="QR~QID14#2~1" />
    <label for="QR~QID14#2~1">disable</label>
</p>
<p>
    <input type="text" id="QR~QID14#1~2~TEXT" />
    <input type="checkbox" id="QR~QID14#2~2" />
    <label for="QR~QID14#2~2">disable</label>
</p>
<p>
    <input type="text" id="QR~QID14#1~3~TEXT" />
    <input type="checkbox" id="QR~QID14#2~3" />
    <label for="QR~QID14#2~3">disable</label>
</p>

JavaScript

$$('input[type="checkbox"]').invoke('observe', 'change', function () {

    for (var i = 1; i <= 3; i++) {
        if ($('QR~QID14#2~' + i).checked === true) {
            $('QR~QID14#1~' + i + '~TEXT').value = '';
            $('QR~QID14#1~' + i + '~TEXT').disabled = true;
        } else {
            $('QR~QID14#1~' + i + '~TEXT').disabled = false;
        }
    }

});