Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 12.11.2008, 21:31   #1
nikleb
Форумчанин
 
Регистрация: 04.04.2007
Сообщений: 131
По умолчанию добавление строки в таблице

Код HTML:
<table>
<tr>
   <td><input type='text'></td>
</tr>
</table>
<input type='button' value='+' onclick="add_line();">
Привет. Нужно написать функцию каторая добовляет строку в таблице с инпутом. Всё бы ничего, но нужно сделать так чтоб введённый текст в инпут не пропал!
nikleb вне форума Ответить с цитированием
Старый 12.11.2008, 22:18   #2
Johnatan
Antimoderаtoris
Участник клуба
 
Регистрация: 08.02.2008
Сообщений: 1,251
По умолчанию

Код HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title>Hello!</title>
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  <script type="text/javascript">
  function add_line(text) {
    document.getElementById('in').value = document.getElementById('in').value+text;
  }
  </script>
</head>

<body>
<table>
    <tr>
        <td><input type='text' id='in'></td>
    </tr>
</table>
<input type='button' value='+' onclick="add_line(' text');">
</body>

</html>
98% из тысячи моих постов сделаны в профильном подфоруме. Я не накручиваю свои посты болтанием в "курилке", а ты?
Johnatan вне форума Ответить с цитированием
Старый 12.11.2008, 22:35   #3
nikleb
Форумчанин
 
Регистрация: 04.04.2007
Сообщений: 131
По умолчанию

Я имел в виду не текст в инпут добовлять, а сами инпуты.
Чтоб после двух нажатий на кнопку таблица выглядела так:
Код:
<table>
<tr>
    <td>
    <input type='text'>
    </td>
</tr>
    <td>
    <input type='text'>
    </td>
</tr>
    <td>
    <input type='text'>
    </td>
</tr>
</table>
<input type='button' value='+' onclick="add_line();">
nikleb вне форума Ответить с цитированием
Старый 13.11.2008, 00:33   #4
Doda
Пользователь
 
Регистрация: 21.11.2007
Сообщений: 64
По умолчанию

Код HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Документ Без Имени</title>

<script>
var tableStruct1, tableStruct2;
tableStruct1 = "<table>";
tableStruct1 = tableStruct1 + "<tr>";
tableStruct1 = tableStruct1 + "<td><input type='text' value='first cell'></td>";
tableStruct2 = "</tr></table>";
tableStruct2 = tableStruct2+"<input type='button' value='+' onclick='addLine();'>"
function addLine() {
//alert(tableStruct1);
tableStruct1 = tableStruct1 + "</tr><tr><td><input type='text' value='one more cell'></td>";
document.all.tableDiv.innerHTML = tableStruct1+tableStruct2;
}

</script>
</head>

<body>
<div id="tableDiv">
</div>
<script>document.all.tableDiv.innerHTML = tableStruct1+tableStruct2;</script>
</body>
</html>
Doda вне форума Ответить с цитированием
Старый 13.11.2008, 01:11   #5
nikleb
Форумчанин
 
Регистрация: 04.04.2007
Сообщений: 131
По умолчанию

Да такого эффекта я тоже добился, но попробуй в первый input вписать значение, а патом нажми "+" и значение первого input'а превратится в first cell. Или это только у меня так? А как сделать чтоб остовалось то что пользователь ввёл?
nikleb вне форума Ответить с цитированием
Старый 13.11.2008, 03:22   #6
Johnatan
Antimoderаtoris
Участник клуба
 
Регистрация: 08.02.2008
Сообщений: 1,251
По умолчанию

Код:
document.all.tableDiv.innerHTML
Убило наповал....

Автору: Используй DOM для создания новых элементов на странице. Тогда ничего стираться не будет.
98% из тысячи моих постов сделаны в профильном подфоруме. Я не накручиваю свои посты болтанием в "курилке", а ты?
Johnatan вне форума Ответить с цитированием
Старый 13.11.2008, 11:41   #7
wall66
Участник клуба
 
Аватар для wall66
 
Регистрация: 04.10.2008
Сообщений: 1,485
По умолчанию

самый простой и доступный (по моему мнению) вариант:
Цитата:
<table id='table_element'>
<tr>
<td>
<input type='text'>
</td>
</tr>
</table>
<input type='button' value='+' onclick="add_line();">

<script>
function add_line(){
document.getElementById('table_elem ent').innerHTML=document.getElement ById('table_element').innerHTML+'<t r><td><input type="text"></td></tr>';
}
<script>
свободен...
wall66 вне форума Ответить с цитированием
Старый 13.11.2008, 12:26   #8
nikleb
Форумчанин
 
Регистрация: 04.04.2007
Сообщений: 131
По умолчанию

Может простой, но данные из инпута всёравно удаляються. Нужно не перезаписывать а добовлять!
nikleb вне форума Ответить с цитированием
Старый 13.11.2008, 12:27   #9
nikleb
Форумчанин
 
Регистрация: 04.04.2007
Сообщений: 131
По умолчанию

Johnatan может подскажеш как?
nikleb вне форума Ответить с цитированием
Старый 13.11.2008, 12:33   #10
Doda
Пользователь
 
Регистрация: 21.11.2007
Сообщений: 64
По умолчанию

Код HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Untitled Document</title>
<script>
var trNode, tdNode, inputNode;
function add_line(rowText) {
trNode = document.createElement('tr');
tbody_node.appendChild(trNode);
tdNode = document.createElement('td');
trNode.appendChild(tdNode);
inputNode = document.createElement('input');
tdNode.appendChild(inputNode);
inputNode.type = "text";
inputNode.value = rowText;
document.getElementById('rowToAdd').value = "";

}

function rem_line(rowNum) {
if (tbody_node.childNodes[rowNum-1]) {
var child_node = tbody_node.childNodes[rowNum-1];
var rem_node = tbody_node.removeChild(child_node);
;} else {alert('введите верное значение')}
document.getElementById('rowToRem').value = "";
}
</script>
</head>

<body>
<div id="tableDiv"></div>
Добавить строку с текстом:&nbsp;<input type="text" id="rowToAdd"><input type="button" value="+" onClick="add_line(document.getElementById('rowToAdd').value)"><br>
Удалить строку №&nbsp;<input type="text" id="rowToRem"><input type="button" value="-" onClick="rem_line(document.getElementById('rowToRem').value)">
<script>

var table_div = document.getElementById('tableDiv');
var table_node = document.createElement('table');
table_div.appendChild(table_node);
table_node.border = 1;
var tbody_node = document.createElement('tbody');
table_node.appendChild(tbody_node);
var tr_node = document.createElement('tr');
tbody_node.appendChild(tr_node);
var td_node = document.createElement('td');
tr_node.appendChild(td_node);
var input_node = document.createElement('input');
td_node.appendChild(input_node);
input_node.type = "text";
input_node.value = "text 1";






</script>

</body>
</html>
2 Johnatan, спасибо за совет. DOM прикольная вещь. Тока твой сарказм не понятен, не все - боги JavaScript

Последний раз редактировалось Doda; 13.11.2008 в 13:32.
Doda вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
добавление строки копированием... ГОСЕАН БД в Delphi 3 13.08.2008 10:32
Добавление строки в книги Леон Microsoft Office Excel 3 10.07.2008 08:17
считать из файла две строки, вывести на экран символы первой строки, которые отсутствуют во второй gotex Помощь студентам 4 08.05.2008 02:27
TMemo добавление строки forumu Компоненты Delphi 5 22.11.2007 20:02
Добавление строки Excel EdNovice Общие вопросы Delphi 1 19.04.2007 09:08