Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.02.2014, 17:07
Новичок на форуме
Отправить личное сообщение для didimka Посмотреть профиль Найти все сообщения от didimka
 
Регистрация: 30.01.2014
Сообщений: 8

Очень надо!!!!!!!Добавление строки в таблицу + условие!!!!!!!!!!!!!!!!!!
Добрый день, есть вот такой код привожу вместе с css:
<!DOCTYPE HTML html public "-//W3C//DTD HTML 5 Transitional//EN">
<html>
	<head>
		<title>form</title>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="class1.css">
		<style type="text/css">
		.base{height: 20px;
width:50px;
border: 1px solid black;
text-align: left;}
.s1{font-size: 80%}
select[name="group"]{height: 20px;
width:150px;
text-align: left;}
.add{height: 20px;
width:50px;
text-align: center;
border-right: 1px solid black;}
.ext{height: 20px;
width:50px;
text-align: left;
border-right: 1px solid black;
border-left: 1px solid black;}
input[type="text"]{width:80px;}
select[name="trainer"]{height: 20px;
width:100px;
text-align: left;}
select[name="weekday"]{height: 20px;
width:80px;
text-align: left;}
select[name="classroom"]{height: 20px;
width:60px;
text-align: center;}
select[name="from"]{height: 20px;
width:50px;}
select[name="till"]{height: 20px;
width:50px;}
.fbase{height: 20px;
width:50px;}
.end{height: 20px;
width:50px;
border-right: 1px solid black;
border-bottom: 1px solid black;}
.ext1{height: 20px;
width:50px;
text-align: right;
border-right: 1px solid black;
border-left: 1px solid black;
border-bottom: 1px solid black;}
.fbase{height: 20px;
width:50px;}

		</style>
	</head>
	<body>
		<table cellSpacing='0' cellPadding='0'>
			<thead>
				<tr><th class="base" colspan="10" rowspan="2"><span class="s1">Group  <select name="group"></select></span><br><span class="s1"><input type="checkbox">  Separate data for each Module</span></th></tr>
				<tr></tr>
			</thead>
			<tbody>
				<tr>
					<td class="base" colspan="3" rowspan="3">
						<span class="s1">jd01</span><br>
						<span class="s1">jd02</span><br>
						<span class="s1">jd03</span>
					</td>
					<td class="base" colspan="7">
						<span class="s1">Intramural classes</span>
					</td>
				</tr>
				<tr>
					<td class="add" colspan="2" rowspan="2">
						<span class="s1">Weekdays</span>
					</td>
					<td class="add" colspan="3" rowspan="2">
						<span class="s1">Timing</span>
					</td>
					<td class="add" rowspan="2">
						<span class="s1">Classroom</span>
					</td>
					<td class="add" rowspan="2">
						<span class="s1">Academic hours</span>
					</td>
				</tr>
				<tr></tr>
				<tr>
					<td class="ext" colspan="3"><span class="s1">Trainer  <select  name="trainer"></select></span></td>
					<td class="add" colspan="2">
						<span><select name="weekday"></select></span>
					</td>
					<td class="add" colspan="3">
						<span class="s1">from <select name="from"></select> till <select name="till"></select></span>
					</td>
					<td class="add">
						<span class="s1"><select name="classroom"></select></span>
					</td>
					<td class="add">
						<span></span>
					</td>
				</tr>
				<tr>
					<td class="ext" colspan="3"><span class="s1">Start date <input  type="text"  name="date" value="" pattern="" placeholder="dd.mm.yyyy" required></span></td>
					<td class="add" colspan="2">
					</td>
					<td class="add" colspan="3">
					</td>
					<td class="add">
					</td>
					<td class="add">
					</td>
				</tr>
				<tr>
					<td class="ext1" colspan="3"><span class="s1" ><input type="button" value="Submit"  class="btn btn-success"></span></td>
					<td class="end" colspan="2">
						<span class="s1"><a href="#">+Add weekdays</a></span>
					</td>
					<td class="end" colspan="3">
					</td>
					<td class="end">
					</td>
					<td class="end">
					</td>
				</tr>
				<tr><td class="fbase"></td><td class="fbase"></td><td class="fbase"></td><td class="fbase"></td><td class="fbase"></td><td class="fbase"></td><td class="fbase"></td><td class="fbase"></td><td class="fbase"></td><td class="fbase"></td></tr>
			</tbody>
		</table>
	</body>
</html>



Суть вопроса: необходимо, чтобы по нажатию Add weekdays в пустую строку дублировалась часть строки выше(выпадающие списки), а следующие нажатия добавляли новые строки с дублированием строки выше. Строка, которая должна добавляться вот:
<tr>
					<td class="ext" colspan="3"></td>
					<td class="add" colspan="2">
						<span><select name="weekday"></select></span>
					</td>
					<td class="add" colspan="3">
						<span class="s1">from <select name="from"></select> till <select name="till"></select></span>
					</td>
					<td class="add">
						<span class="s1"><select name="classroom"></select></span>
					</td>
					<td class="add">
						<span></span>
					</td>
				</tr>

У кого есть идеи, буду очень признателен!!!!

Последний раз редактировалось didimka, 18.02.2014 в 20:28.
Ответить с цитированием
  #2 (permalink)  
Старый 18.02.2014, 17:25
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

После загрузки страницы сохрани в переменную копию (сэмпл) строки (var sample = row.cloneNode(true) ). Далее просто добавляй копию этой копии.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 18.02.2014, 17:27
Новичок на форуме
Отправить личное сообщение для didimka Посмотреть профиль Найти все сообщения от didimka
 
Регистрация: 30.01.2014
Сообщений: 8

danik.js,
не понимаю, можете показать?
Ответить с цитированием
  #4 (permalink)  
Старый 19.02.2014, 14:22
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,718

http://www.w3schools.com/jsref/met_table_insertrow.asp

Не требуется, похоже достаточно клонировать элемент со всем барахлрм, а потом поменять некоторые значения по обстоятельствам.

Последний раз редактировалось kostyanet, 19.02.2014 в 14:29.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
datatables как добавить в таблицу данных не перерисовывая строки? Kenuat jQuery 0 02.12.2013 17:14
Добавление строк в таблицу (JQuery) tiksi jQuery 2 16.05.2013 08:01
как вставить строки в таблицу? Yurik Events/DOM/Window 2 29.02.2012 17:14
Добавление строк в таблицу MCTrane Общие вопросы Javascript 14 28.11.2010 18:18
Добавление строк в таблицу stanlee Элементы интерфейса 13 11.06.2008 17:38