Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: для новичков > checkbox !!!


Автор: hostsid 30.9.2008, 17:57
необходимо, что б, если включён checkbox, становилось доступным для редактирования сооветствующее этому checkbox'у текстовое поле.

Код

<script>
function show_p(form) { 
for (i=0; i<=3; i++) {
    if (form.p[i].checked = 0) {
    form.m_p[i].disabled = 0;                
    }
    else {
    form.m_p[i].disabled = 1;                
    }
}
return;
}
</script>

<form>
...
<td class="point"><input type="checkbox" name="p1" onclick="show_p(this.form);"/></td>
<td class="point"><input type="text" name="m_p1" disabled></td>
...
...
</form>


не выходит...ХЕЛП ПЛЗ!!!!!  smile 

Автор: ksnk 30.9.2008, 18:44
Код

<script>
function show_p(el) { 
    var inp=el.parentNode.parentNode.getElementsByTagName('input')[1];
    inp.disabled=!!inp.disabled?"":"disabled";
}
</script>
<form>
<table>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p1" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p2" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p3" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p4" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p5" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p6" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p7" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p1" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p1" disabled></td>
</tr>
<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p1" disabled></td>
</tr>
</table>
</form>

Автор: hostsid 30.9.2008, 19:05
...лично мне непонятно как, но работает. СПАСИБО ОГРОМНОЕ!

Автор: ksnk 30.9.2008, 19:15
hostsid, 
- при вызове обработчика события переменная this указывает на собственно элемент.
- строка var inp=el.parentNode.parentNode.getElementsByTagName('input')[1]; говорит - возьмем от нашего элемента родителя->родителя (это будет tr). Затем в получившейся ветке поищем все элементы input. затем возьмем из получившегося массива 1 элемент - это будет input-text (0-м будет сам чекбокс) Вот здесь идет неслабый заклад на структуру html документа. Cвязанные элементы должны располагаться именно таким образом 
- у инпута поменяем свойство disabled на "" или строку "disabled". Такое работет во всех доступных мне броузерах, в то время как с логическими значениями кто-то, вроде глючил...

Вот, вроде и все smile

Автор: hostsid 2.10.2008, 23:19
а если надо что б было чекбокс выключал и включал активность не одного текстового поля...а 2х расположенных рядом?

Код

<tr>
<td class="point"><input type="checkbox" onclick="show_p(this);"/></td>
<td class="point"><input type="text" name="m_p1" disabled></td>
<td class="point"><input type="text" name="m_p1_1" disabled></td>
</tr>


?

Автор: ksnk 3.10.2008, 07:50
Код

function show_p(el) { 
    var inp=el.parentNode.parentNode.getElementsByTagName('input');
    inp[1].disabled=!!inp[1].disabled?"":"disabled";
    inp[2].disabled=!!inp[2].disabled?"":"disabled";
}

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)