Редактируемая таблица

@SphiNkSs · Регистрация: 28.03.2010

Студворк — интернет-сервис помощи студентам

Господа web-програмисты!
Я не силен в html и всвязи с этим у мну возникла проблема. Мне необходимо в зависимости от некотороых значений, сгенерировать таблицу с редактируемыми ячейками.
Вот что уже получилось:

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
<?php 
 
echo "Количество уровней вероятности появления угрозы: " . $_GET["val1"] . "<br />"; 
$pyr=$_GET["val1"];
echo "Количество уровней вероятности появления уязвимости: " . $_GET["val2"] . "<br />"; 
$pyz=$_GET["val2"];
echo "Количество уровней информационного риска: " . $_GET["val3"] . "<br />"; 
$risk=$_GET["val3"];
 
echo <<<HTML
<script type="text/javascript">
function FuncT()
{
var table = document.getElementById('riskTable');
var trList= table.getElementsByTagName('tr');
for (var i=0;i<trList.length;i++)
{
  var tdList = trList[i].getElementsByTagName('td');
  
  for (j=0;j<tdList.length;j++) 
  {
  alert('trList['+i+'] tdList['+j+'].innerHTML='+tdList[j].textContent);
  }
}
}
 
function FuncRR()
{
var t= document.getElementById('sel3');
alert('t='+t);
}
</script>
HTML;
$io=0;
function Sel_box($r) 
{
$io++;
switch($r)
{
case 3:
{
echo <<<HTML
<select style="text-align:center;width:150">
<option>Н1</option>
<option>С1</option>
<option>В1</option>
</select>
HTML;
break;
}
 
case 4:
{
echo <<<HTML
<select style="width:150">
<option>Н</option>
<option>С</option>
<option>В</option>
<option>ОВ</option>
</select>
HTML;
break;
}
 
case 5:
{
echo <<<HTML
<select style="width:150">
<option>ОН</option>
<option>Н</option>
<option>С</option>
<option>В</option>
<option>ОВ</option>
</select>
HTML;
break;
}
}
};
 
echo <<<HTML
<html>
<head>
  <title>Определение информационных рисков .:. Этап 2 / 3</title>
</head>
<body>
 
<table width="1050" height="100">
<tr>
<td align="center">
<table width="100%" border="2" id="riskTable">
<tbody>
<tr>
<td rowspan="2" colspan="1" style="text-align:center;width:150">
<b>Уровень для P<sub>уз</sub></b>
</td>
<td rowspan="2" colspan="1" style="text-align:center;width:150">
<b>Уровень для P<sub>уг</sub></b>
</td>
<td rowspan="1" colspan="5" style="text-align:center;">
<b>Уровни шкалы потерь</b>
</td>
</tr>
<tr>
<td style="text-align:center;width:150">
N
</td>
<td style="text-align:center;width:150">
Mi
</td>
<td style="text-align:center;width:150">
Mo
</td>
<td style="text-align:center;width:150">
S
</td>
<td style="text-align:center;width:150">
C
</td>
</tr>
HTML;
for ($i = 1; $i <= $pyz; $i++)
{
echo <<<HTML
<tr>
<td style="text-align:center;vertical-align: center;" rowspan=$pyr colspan="1">
HTML;
switch($pyz)
{
    case 4:
      {
      if ($i==1) echo ("Н");
      if ($i==2) echo ("С");
      if ($i==3) echo ("В");
      if ($i==4) echo ("ОВ");
      break;
      }
    case 5:
      {
      if ($i==1) echo ("ОН");
      if ($i==2) echo ("Н");
      if ($i==3) echo ("С");
      if ($i==4) echo ("В");
      if ($i==5) echo ("ОВ");
      break;
      }
} 
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
Н
</td>
<td style="text-align:center;vertical-align: center;" type=text>
HTML;
Sel_box($risk);
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
</tr>
HTML;
for ($j = 1; $j < $pyr; $j++)
{
echo <<<HTML
<tr>
<td style="text-align:center;vertical-align: center;">
HTML;
switch($pyr)
{
    case 3:
      {
      if ($j==1) echo ("С");
      if ($j==2) echo ("В");
      break;
      }
    case 4:
      {
      if ($j==1) echo ("С");
      if ($j==2) echo ("В");
      if ($j==3) echo ("ОВ");
      break;
      }
} 
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
<td style="text-align:center;vertical-align: center;">
HTML;
Sel_box($risk);
echo <<<HTML
</td>
</tr>
HTML;
}
}
echo <<<HTML
</tbody>
</table>
<input type="button" style="width:100%;text-align:center" value="Продолжить" onClick="FuncT()"/>
</td>
</tr>
</table>
 
</body>
</html>
HTML;
?>

Ссылка доступа: http://localhost/gotable.php?val1=3&val2=4&val3=3

Осталась проблема: как считать необходимые значения из таблицы в массив???
Допускаю, что вариантов решения проблемы несколько и посему, вопрос звучит следующим образом:
Как считать значения, из таблицы, которая есть (см. код выше) или как построить таблицу с редактируемыми ячейками для последующего считывания из нее данных в массив???

Добавлено через 13 часов 1 минуту
Неужели это не возможно?!

@Alorian · 01.03.2011, 12:07

Код выше мягко говоря далек от html, css. Там js и php.

Вопрос 1

Сообщение от SphiNkSs

сгенерировать таблицу с редактируемыми ячейками

Что это такое? Если просто выполнить ваш код, то появится самая обычная таблица.
Никаких редактируемых ячеек в ней нет.

Редактируемые ячейки, как я понимаю это такие ячейки в которые можно ввести текст. Чтобы можно было вводить текст нужен тэг <input> либо <textarea> внутри ячейки.

Вопрос 2

Сообщение от SphiNkSs

как построить таблицу с редактируемыми ячейками для последующего считывания из нее данных в массив???

Отправлять данные с html страницы можно двумя способами:
1. Сделать форму(<form></form>) и потом по нажатии кнопки submit отправлять данные. Это именно html решение.
2. Использовать js. Распарсить нужные данные и отправить по какому нибудь событию.

Каким способом ты хочешь получать данные со страницы?

Переформулируй, или сам разберись чего ты собственно хочешь получить, а потом запости четкую задачу сюда.

@SphiNkSs · 02.03.2011, 06:51 **[ТС]**

Код - далек, зато вопрос близок

Отвечаю на первый вопрос:
В своем коде я добился того, чего хочу в идеале... Это таблица состоящая из ячеек, в которые выбираются строго определенные значения... Таблица состоящая из тега <select>.

Но застопорился на этапе передачи данных на следующую страницу...
Сразу попытаюсь ответить на второй вопрос:
изначально я собирался передавать данные через форму, но поиски того, как считать данные из таблицы привели меня к js:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
function FuncT()
{
var table = document.getElementById('riskTable');
var trList= table.getElementsByTagName('tr');
for (var i=0;i<trList.length;i++)
{
  var tdList = trList[i].getElementsByTagName('td');
  
  for (j=0;j<tdList.length;j++) 
  {
  alert('trList['+i+'] tdList['+j+'].innerHTML='+tdList[j].textContent);
  }
}
}

Но эта функция выполняет задачу не в полном объеме... То есть она успешно считывает данные из ячеек, но корректно - только из статически забитых в таблицу. И в зависимости от метода:

innerText
innerHTML
outerText
outerHTML
textContent

функция при считывании выдает либо null, либо html код ячейки.

Так что пока я не могу однозначно и обосновано ответить на этот вопрос:

Каким способом ты хочешь получать данные со страницы?

В итоге данные из переменных ячеек таблицы должны сбиться в массив, который будет анализироваться дальше скорей всего js, желательно на другой странице. Вопрос ограниченности выбора значений в конкретных ячейках не важен, но актуален...

Буду пытаться экспериментировать с <textarea>...
Тег <input> дает результат не больше, чем с <select>...

Спасибо, что откликнулись

@Alorian · 02.03.2011, 08:47

Сообщение от SphiNkSs

изначально я собирался передавать данные через форму

1. Оберни всю таблицу в тэг <form method="get" action="test.php">. В таблице в каждой ячейке естественно select или input или textarea.
2. Снизу под таблицей, но внутри <form> добавь <input type="submit" value="Submit" />
Теперь все данные которые ввел в форме будут отправляться на страницу test.php при нажатии кнопки submit.

На странице test.php данные можно получить:
1. На серверной стороне, на php вот так:

PHP
1
2
3
<pre>
    <?print_r($_GET);?>
</pre>

2. На клиентской стороне, на js вот так например:
http://javascript.ru/blog/Carz... assiva-GET.
То есть распарсив все что после знака "?" в URL.

Сообщение от SphiNkSs

Но эта функция выполняет задачу не в полном объеме... То есть она успешно считывает данные из ячеек, но корректно - только из статически забитых в таблицу. И в зависимости от метода:

Если хочешь отправлять данные не формой, а с помощью JS, то innerHTML не подойдет. Вот так можно работать с тэгом <select> например:
http://www.tigir.com/javascript_select.htm

Если покороче, то к select можно обратиться вот так:

JavaScript
1
2
3
var select = document.getElementById("mySelectId");
alert(select.options[0].value);
alert(select.options[0].text);

Отправлять данные на сервер можно с помощью xmlhttprequest
Можно сабмитить форму с помощью js, для этого есть метод submit()

@SphiNkSs · 02.03.2011, 18:10 **[ТС]**

Точно! Это все так! И это первое что пришло и мне в голову, но вот в чем проблема:
Все эти способы требуют наличия либо имен, либо идешников у элементов, которые должны передавать значения. А моя таблица, и в том числе и содержимое ячеек формируется в зависимости от параметров полученных с предыдущей страницы. И чтобы не писать километры кода, я генерирую её в циклах с условными операторами.

И соответственно я не присваиваю <select>ам в таблице ни имени, ни id. В результате чего, я не могу к ним напрямую обращаться

.

Вот и ищу способ снять значения из таблицы не используя прямое обращение к её элементам.

Может ты можешь подсказать способ, как задавать имена элементов создавая их в цикле?..
Или может есть некие "имена по умолчанию"???
Или есть смысл отказаться от идеи сократить код и написать таблицу перебрав все варианты таблицы вручную???...
Ну или найти способ снять значения из таблицы без использования имен...

@Alorian · 02.03.2011, 19:01

Сообщение от SphiNkSs

И соответственно я не присваиваю <select>ам в таблице ни имени, ни id. В результате чего, я не могу к ним напрямую обращаться

А почему не присваиваешь прямо в цикле? Как ты вообще отличаешь одно значение от другого? В чем смысл всего этого если значение конкретного селекта для тебя вообще не важно?

Имена желательно давать хоть немного по смыслу. Если выбираешь страницу в селекте, то присвой имя "page". Если выбираешь вес, то присвой имя "weight". В твоей таблице я не понимаю смысловую нагрузку всех этих селектов, если ты их смысл понимаешь ну и назови соответственно. Если тебе главное передать переменные, и смысл вообще не важен, то присвой например в соответсвии с рядами и ячейками таблицы. Например имя "tr1td5" для первого ряда пятой ячейки или "tr6td9" для шестого ряда и девятой ячейки. Хотя я не понимаю зачем оно все надо если никакого полезного результата в итоге не будет.

Как вариант можно делать многоуровневый массив GET, присваивать всем ячейкам в одном ряду имя "tr1[]", то есть пустые скобки, тогда массив get в php будет выглядеть примерно так:
tr1[0] первая ячейка первого ряда, tr1[1] вторая ячейка первого ряда и т.д.

@SphiNkSs · 06.03.2011, 07:29 **[ТС]**

Спасибо огромное!

Как вариант можно делать многоуровневый массив GET, присваивать всем ячейкам в одном ряду имя "tr1[]", то есть пустые скобки, тогда массив get в php будет выглядеть примерно так:
tr1[0] первая ячейка первого ряда, tr1[1] вторая ячейка первого ряда и т.д.

То что нужно!)))

31.03.2011, 12:06

Ну товарищи, нельзя-же так!
Не плодите сущностей без необходимости, не утяжеляйте код.
У Вас-же есть innerHTML - обращайтесь к нему:

JavaScript
1
2
3
4
5
6
table = document.getElementById('Tablica')
trList= table.getElementsByTagName('tr')
for (i=0; i<trList.length; i++) {
    tdList = trList[i].getElementsByTagName('td')
    text[i] = tdList[3].innerHTML.split('"')[5]          //Здесь необходимо поставить разделитель и номер вхождения
}

В массиве text[] у Вас будет содержимое input-ов например.

Новые блоги и статьи Все статьи Все блоги /
Восстановить юзерскрипты Greasemonkey из бэкапа браузера damix 15.01.2026 Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .	Изучаю kubernetes lagorue 13.01.2026 А пригодятся-ли мне знания kubernetes в России?	Сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/	WordPad для Windows 11 Jel 10.01.2026 WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .
Classic Notepad for Windows 11 Jel 10.01.2026 Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .	Почему дизайн решает? Neotwalker 09.01.2026 В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .	Модель микоризы: классовый агентный подход 3 anaschu 06.01.2026 aa0a7f55b50dd51c5ec569d2d10c54f6/ O1rJuneU_ls https:/ / vkvideo. ru/ video-115721503_456239114	Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ФедосеевПавел 06.01.2026 Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .

@SphiNkSs 5 / 5 / 3 Регистрация: 28.03.2010 Сообщений: 146
	02.03.2011, 18:10 [ТС]
	Точно! Это все так! И это первое что пришло и мне в голову, но вот в чем проблема: Все эти способы требуют наличия либо имен, либо идешников у элементов, которые должны передавать значения. А моя таблица, и в том числе и содержимое ячеек формируется в зависимости от параметров полученных с предыдущей страницы. И чтобы не писать километры кода, я генерирую её в циклах с условными операторами. И соответственно я не присваиваю <select>ам в таблице ни имени, ни id. В результате чего, я не могу к ним напрямую обращаться. Вот и ищу способ снять значения из таблицы не используя прямое обращение к её элементам. Может ты можешь подсказать способ, как задавать имена элементов создавая их в цикле?.. Или может есть некие "имена по умолчанию"??? Или есть смысл отказаться от идеи сократить код и написать таблицу перебрав все варианты таблицы вручную???... Ну или найти способ снять значения из таблицы без использования имен... 0