Как связать елементы
Здравствуйте !
Прошу помощи в решение сл. проблемы .... есть форма которая формирует список файлов сл. образом: чекбокс - имя файла - режим чтения(селект) - режим записи(селект) как по выбранному чекбоксу получить соответствующие значения 2х селектов !? Код
$i = 0;
while ($Files) {
$FileList .= '
<tr class="Table">
<td align="center" class="Table_Form">
<input type="checkbox" class="Checkbox" id="' . $i . '" name="Checkbox[]">
</td>
<td align="left">
<label for="' . $i . '">
<div class="Checkbox_Name">' . $File . '</div>
</label>
</td>
<td align="right">
<select id="' . $i . '" name="ReadMode[]" form="DBForm">
<option value="bin">Binary</option>
<option value="text">Text</option>
</select>
</td>
<td align="right">
<select id="' . $i . '" name="WriteMode[]" form="DBForm">
<option value="bin">FullBackup</optin>
<option value="text">StructureBackup</optin>
</select>
</td>
</tr>
';
$i++;
}
|
some0ne, причем тут твой ПХП? Делай простой хтмлный пример...
|
Цитата:
|
Допустим узнал чекбокс по id, получил значение етого id в переменную, номер строки будет совпадать с номером id... а вот как теперь обратиться к етой строке и вытянуть select-ы ?
|
Цитата:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(function (){
$('button').click(function (){
$('.Table input:checked').each(function (){
$(this.parentNode.parentNode).find('select').each(function (){
alert(this.value);
});
});
});
});
</script>
</head>
<body>
<table>
<tr class="Table">
<td align="center" class="Table_Form">
<input type="checkbox" class="Checkbox" name="Checkbox[]">
</td>
<td align="left">
<label>
<div class="Checkbox_Name">$File 1</div>
</label>
</td>
<td align="right">
<select name="ReadMode[]" form="DBForm">
<option value="bin1">Binary</option>
<option value="text1">Text</option>
</select>
</td>
<td align="right">
<select name="WriteMode[]" form="DBForm">
<option value="bin2">FullBackup</optin>
<option value="text2">StructureBackup</optin>
</select>
</td>
</tr>
<tr class="Table">
<td align="center" class="Table_Form">
<input type="checkbox" class="Checkbox" name="Checkbox[]">
</td>
<td align="left">
<label>
<div class="Checkbox_Name">$File 2</div>
</label>
</td>
<td align="right">
<select name="ReadMode[]" form="DBForm">
<option value="bin3">Binary</option>
<option value="text3">Text</option>
</select>
</td>
<td align="right">
<select name="WriteMode[]" form="DBForm">
<option value="bin4">FullBackup</optin>
<option value="text4">StructureBackup</optin>
</select>
</td>
</tr>
</table>
<button>getValue</button>
</body>
</html>
|
Да, спасибо, ето подошло ....
возник еще небольшой вопрос - если один из селектов изначально установлен в пустое значение, как это можно проверить !? Переделал немного код чтобы вести учет выбранных элементов
var list = null;
var chk_res = [];
var sel_res = [];
var selectVal;
list = $('.Main input:checked');
list.each( function(index) {
chk_res += $(this).attr('id');
if (index < list.length - 1)
chk_res += ',';
$(this.parentNode.parentNode).find('select').each(function (){
selectVal = this.value;
if (selectVal === null)
selectVal = "none";
sel_res += selectVal;
});
});
chk_res.toString();
sel_res.toString();
var hiddenCheck = document.getElementById('Checklist');
hiddenCheck.value = chk_res;
var hiddenSelect = document.getElementById('Selectlist');
hiddenSelect.value = sel_res;
но вот если селект не выбран то его значение (предусмотренное в none) не выводит ! Чекбоксы - все отображает ! |
Цитата:
У вас одинаковый id как число присвоен нескольким элементам. Обычно же, ну типа w3c так считает, что id должен быть уникальным и желательно чтобы начинался с буквы. Атрибуты типа align="right" показывают что вы собираете коды по крупицам не понимая чего каждая крупинка означает. Вот так надо: <tr id="row'.$i.'"> <input type="checkbox" name="Checkbox[.'$i.']"> <input type="select" name="SelectOne['.$i.']"> <input type="select" name="SelectTwo['.$i.']"> <input type="select" name="SelectOneHundredFiveHundreds['.$i.']"> На сервере получите обычные массивы successful элементов как и предусмотрено. А на клиенте без мороки с родственниками мгновенно получите ссылку на любой объект по индексу, который элементарно достать из this.name В том числе таким вот дубовым методом
var select100500 = document.getElemensByName(this.name.replace('Checkbox', 'SelectOneHundredFiveHundreds')[0];
Вполне понятно что и собственно id могут быть точно такими же как name, поскольку это разные атрибуты, и тогда
var select100500 = document.getElemenById(this.id.replace('Checkbox', 'SelectOneHundredFiveHundreds'));
Но самая мякотка это воткнуть в тот цикл while($File) генерацию js-кода через который сообщить включенному скрипту все чего он хотел бы узнать. |
Цитата:
|
| Часовой пояс GMT +3, время: 03:08. |