Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Динамическое добавление div в таблицу, по checkbox / 4 сообщений из 4, страница 1 из 1
02.11.2016, 22:54
    #39340381
AlexOk
AlexOk
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Динамическое добавление div в таблицу, по checkbox
Доброго времени суток. Подскажите пожалуйста как реализовать правильно. Вот мой пример в котором при клике на checkbox, форма появляется и исчезает при снятии галочки. Хочу сделать так, чтобы вне зависимости от порядка в котором выбираешь чекбоксы (не обязательно 1-2-3, например 3-4-6) формы появлялись по порядку - сначала в первой строке, если после выбранного 3его чекбокса выбрать четвертый, то соответственно 4я форма должна появиться на следующей строке.
Как это сделать ума не приложу, натолкните на мысль или может подскажите куском кода. Спасибо.
Код: html
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.
<html>
<head>
  <title> </title>
</head>
<body>
<li>
<label>check1</label>
<input onclick="show('1')" type="checkbox" id="c1" name="option1" value="a2">
</li>
<li>
<label>check2</label>
<input onclick="show('2')"  type="checkbox" id="c2" name="option2" value="a2">
</li>
<li>
<label>check3</label>
<input onclick="show('3')"  type="checkbox" id="c3" name="option3" value="a2">
</li>
<li>
<label>check4</label>
<input onclick="show('4')"  type="checkbox" id="c4" name="option4" value="a2">
</li>
<li>
<label>check5</label>
<input  onclick="show('5')" type="checkbox" id="c5" name="option5" value="a2">
</li>
<li>
<label>check6</label>
<input onclick="show('6')" type="checkbox" id="c6" name="option6" value="a2">
</li>
<table>
  <tr>
    <td>
      <div id="1" style="display: none">
        <li><label>Input1</label></li>
        <li><input class="i1" type="text" name="name" /></li>
    </div>
    </td>
    <td>
      <div id="2" style="display:none">
        <li><label>Input2</label></li>
        <li><input class="i2" type="text" name="name" /></li>
      </div>
    </td>
    <td>
      <div id="3" style="display: none">
        <li><label>Input3</label> </li>
        <li><input class="i3" type="text" name="name" /></li>
      </div>
    </td>
  </tr>
  <tr>
    <td>
      <div id="4" style="display: none">
        <li><label>Input4</label></li>
        <li><input class="i4" type="text" name="name" /></li>
      </div>
    </td>
    <td>
      <div id="5" style="display: none">
        <li><label>Input5</label></li>
        <li><input class="i5" type="text" name="name" /></li>
      </div>
    </td>
    <td>
      <div id="6" style="display: none">
        <li><label>Input6</label></li>
        <li><input class="i6" type="text" name="name" /></li>
      </div>
    </td>
  </tr>
</table>

<script type="text/javascript">
  function show(id){
    display = document.getElementById(id).style.display;

    if(display=='none'){
      document.getElementById(id).style.display='block';
    }else{
      document.getElementById(id).style.display='none';
    }
  }
</script>
</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
03.11.2016, 08:24
    #39340467
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Динамическое добавление div в таблицу, по checkbox
AlexOkХочу сделать так, чтобы вне зависимости от порядка в котором выбираешь чекбоксы (не обязательно 1-2-3, например 3-4-6) формы появлялись по порядку - сначала в первой строке, если после выбранного 3его чекбокса выбрать четвертый, то соответственно 4я форма должна появиться на следующей строке.
А если нажмут 3, 1, 4?
В каком порядке должны "выстроится" формы?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
03.11.2016, 08:48
    #39340478
AlexOk
AlexOk
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Динамическое добавление div в таблицу, по checkbox
krvsa, 3, 1, 4 в таком и будут) Спасибо
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
03.11.2016, 11:05
    #39340596
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Динамическое добавление div в таблицу, по checkbox
AlexOk3, 1, 4 в таком и будут)
Тогда тебе есть смысл использовать флексбокс, там есть такие возможности по "перестановке" элементов...
http://html5.by/blog/flexbox/
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Динамическое добавление div в таблицу, по checkbox / 4 сообщений из 4, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]