Буду краток =)
Почему это не работает:
Полная Версия: Создание динамической формы
| Код |
| <script> function addField(){ document.getElementById('phlist').insertAdjacentHTML('BeforeEnd', '<tr><td><input type="file" name="photo[]"></td></tr>'); } </script> <form enctype="multipart/form-data" action="" method="post"> <table border=1> <tr> <th>Выберите загружаемые файлы:</th> </tr> <span id="phlist"> <tr> <td> <input type="file" name="photo[]"> </td> </tr> </span> <tr align="right"> <td> <input type="hidden" value="0" id="ph_fnum"> <input type="button" value="+1" onclick="addField();"> <input type="submit" value="Загрузить" onclick="this.value='Загрузка...'" disabled> </td> </tr> </tbody> </table> </span> </form> |
А вот это работает:
| Код |
| <script> function addField(){ document.getElementById('phlist').insertAdjacentHTML('BeforeEnd', '<br><input type="file" name="photo[]">'); } </script> <form enctype="multipart/form-data" action="" method="post"> <table border=1> <thead> <tr> <th>Выберите загружаемые файлы:</th> </tr> </thead> <tfoot> <tr align="right"> <td> <input type="hidden" value="0" id="ph_fnum"> <input type="button" value="+1" onclick="addField();" id="addF"> <input type="submit" value="Загрузить" onclick="this.value='Загрузка...'" disabled> </td> </tr> </tfoot> <tbody> <tr> <td id="phlist"> <input type="file" name="photo[]"> </td> </tr> </tbody> </table> </form> |
Почему то JS отказывается вообще менять размерность таблицы
Буду признателен за помощь.
P.S. вместо тега span пробовал использовать tbody, tr... толку нет.
Спустя 1 день, 10 часов, 40 минут, 8 секунд (17.07.2007 - 10:44) LiZ@RD написал(а):
Ну если никто не знает в чём трабла и как её решить, то может предложите свой вариант написания? %) 
Задача:
Дана таблица с формой. По клику на спец. кнопке надо добавить одну строку в конец таблицы ну и элементы формы, соответственно.
В гугль не слать, там один пример на всех сайтах и он мне не подходит, т.к. при добавлении элементов уже введённые значения сбиваются.
Задача:
Дана таблица с формой. По клику на спец. кнопке надо добавить одну строку в конец таблицы ну и элементы формы, соответственно.
В гугль не слать, там один пример на всех сайтах и он мне не подходит, т.к. при добавлении элементов уже введённые значения сбиваются.
Спустя 27 дней, 1 час, 49 минут, 5 секунд (14.08.2007 - 12:33) Ghirik написал(а):
Цитата
Задача:
Дана таблица с формой. По клику на спец. кнопке надо добавить одну строку в конец таблицы ну и элементы формы, соответственно.
В гугль не слать, там один пример на всех сайтах и он мне не подходит, т.к. при добавлении элементов уже введённые значения сбиваются.
Дана таблица с формой. По клику на спец. кнопке надо добавить одну строку в конец таблицы ну и элементы формы, соответственно.
В гугль не слать, там один пример на всех сайтах и он мне не подходит, т.к. при добавлении элементов уже введённые значения сбиваются.
Задачи ставят здесь:
http://www.phpforum.ru/index.php?showforum=15
Это не Гугле.
Спустя 1 день, 19 часов, 1 минута (16.08.2007 - 07:34) LiZ@RD написал(а):
Спасибо, огромнейшее за помощь, теперь мне всё понятно.
Может, ещё подскажешь где задают вопросы по JS?
Остряг. По поводу гула я уже всё отписал.
Может, ещё подскажешь где задают вопросы по JS?
Цитата
Это не Гугле.
Остряг. По поводу гула я уже всё отписал.
Спустя 6 дней, 7 часов, 36 минут, 41 секунда (22.08.2007 - 15:10) Ghirik написал(а):
Цитата
Остряг. По поводу гула я уже всё отписал.
Вы вопрос так ставите, как будь то кто-то обязан решать Ваши задачи.
Про Гугль. Там не один пример. Но решения вашего вопроса в чистом виде действительно нет, оно и понятно, редко находятся готовые решения.
Раз уж здесь встал вопрос по динамическому созданию формы, пожалуйста, объясните мне зачем это надо? Я вообще не понимаю смысла динамического создания элементов. В чем выигрыш? Кроме глобального усложнения ни чего из этого не выходит. Мало того, что при динамическом создании, нужно принимать меры для идентификации элементов, дак ещё и совокупный код получается значительно объемнее, запутаннее простого вывода HTML.
Зачем усложнять себе жизнь?
Так ведь гараздо проще!
Код
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Dynamic table</title>
<script language="javascript">
<!--
i=1
a="<table id=t1 border=1>"
b="<tr><td id=td"+i+">Вот Вам и ячеечка!</td><td><INPUT onclick=contents(td"+i+") type=button value=Contents></td></tr>"
c="</table>"
d="Вот и поменяли"
function tab(){
p1.innerHTML=a+b+c
}
function cell(){
i++
b+="<tr><td id=td"+i+">Вот Вам и ячеечка!</td><td><INPUT onclick=contents(td"+i+") type=button value=Contents></td></tr>"
tab()
}
function contents(f){
f.innerHTML=d
}
//-->
</script>
</head>
<body onload=tab()>
<FORM name=form method=post>
<p id=p1> </p>
<INPUT onclick=cell() type=button value="+Cell">
</FORM>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Dynamic table</title>
<script language="javascript">
<!--
i=1
a="<table id=t1 border=1>"
b="<tr><td id=td"+i+">Вот Вам и ячеечка!</td><td><INPUT onclick=contents(td"+i+") type=button value=Contents></td></tr>"
c="</table>"
d="Вот и поменяли"
function tab(){
p1.innerHTML=a+b+c
}
function cell(){
i++
b+="<tr><td id=td"+i+">Вот Вам и ячеечка!</td><td><INPUT onclick=contents(td"+i+") type=button value=Contents></td></tr>"
tab()
}
function contents(f){
f.innerHTML=d
}
//-->
</script>
</head>
<body onload=tab()>
<FORM name=form method=post>
<p id=p1> </p>
<INPUT onclick=cell() type=button value="+Cell">
</FORM>
</body>
</html>
Работает во всех современных браузерах. Кнопки "Contents" выведены только, чтобы показать, что элементы идентифицируются.
Это я накидал на "скорую руку", а если всё хорошо продумать...
И если учесть что я не программист...
Спустя 2 дня, 7 часов, 35 минут, 38 секунд (24.08.2007 - 22:46) LiZ@RD написал(а):
Цитата(Ghirik @ 22.8.2007, 16:10) [snapback]26240[/snapback]
Вы вопрос так ставите, как будь то кто-то обязан решать Ваши задачи.
Не знаю, на мой взгляд - вопрос как вопрос, не вижу в нём повелительного тона... Может это только мне так кажется, тогда извиняюсь.
Цитата(Ghirik @ 22.8.2007, 16:10) [snapback]26240[/snapback]
Про Гугль. Там не один пример. Но решения вашего вопроса в чистом виде действительно нет, оно и понятно, редко находятся готовые решения.
Ну я по крайней мере тока один нашёл, может это я так искал... хотя на мой взгляд задача достаточно распространённая, поэтому наверняка кто то уже решал такую проблему.
Цитата(Ghirik @ 22.8.2007, 16:10) [snapback]26240[/snapback]
Раз уж здесь встал вопрос по динамическому созданию формы, пожалуйста, объясните мне зачем это надо? Я вообще не понимаю смысла динамического создания элементов. В чем выигрыш? Кроме глобального усложнения ни чего из этого не выходит. Мало того, что при динамическом создании, нужно принимать меры для идентификации элементов, дак ещё и совокупный код получается значительно объемнее, запутаннее простого вывода HTML.
Ну не совсем формы... её элементов и элементов таблицы. Проблем с идентификацией не вижу - делать массивы идентификаторов и всё норм должно быть (напр., name="name[]").
Цель - создать форму для загрузки файлов, сколько файлов загружается за раз - не известно... конечно, можно пойти и в обход - загружать по одному, или что бы пользователь выбирал сначала сколько он хочет файлов загрузить, но это не будет смотреться кривовато..
Сенкс за пример, но это не много не то. Если заменить type=button на type=text и изменить текст на что нибудь, то будет видно, что введённые значения сбрасываются на дефолтные при добавлении ячеек. Можно все введённые значения перед добавлением нового элемента сохранять, но это, на мой взгляд, и есть "усложнение жизни", наверняка ведь есть и другой путь
Да и всё же хотелось бы узнать почему же в моих примерах в одном работает всё, а в другом нет.
Спустя 23 часа, 29 минут (25.08.2007 - 22:15) Ghirik написал(а):
Цитата(LiZ@RD @ 25.8.2007, 1:46) [snapback]26333[/snapback]
Да и всё же хотелось бы узнать почему же в моих примерах в одном работает всё, а в другом нет.
Я пробовал формировать HTML через динамическое создание объектов, мне не понравилось. Для создания строки есть специальный метод, а не insertAdjacentHTML, для создания столбца ещё один, и т.д.... Я уже не помню названий. Вообще, для каждого элемента - свой метод, кошмар
. А так... innertHTML, и Вася не корябайся.Цитата
то будет видно, что введённые значения сбрасываются на дефолтные при добавлении ячеек.
Да не будет ни чего сбрасываться, если не перерисовывать всё подряд. В моём примере происходит заново вывод всего HTML-а, при каждом добавлении ячейки. Если этого не делать, то и значения не изменятся.
Спустя 2 часа, 4 минуты, 19 секунд (26.08.2007 - 00:19) Ghirik написал(а):
Один, из возможных, вариантов. Чтобы сохранялось выбранное значение, нужно метод innerHTML применять не к параграфу, а к элементу '<TD>'.
При этом, создавая один элемент, нужно создавать следующий, пока пустой, но с идентификатором. Чтобы при следующем нажатии кнопки, было к чему обращаться. Закрывающие тэги '</td></tr>' можно прописать "жестко", в неизменяемой области (а можно и вообще не прописывать
), а при создании новой ячейки оставлять их открытыми.
Можно по разному решать этот вопрос.
При этом, создавая один элемент, нужно создавать следующий, пока пустой, но с идентификатором. Чтобы при следующем нажатии кнопки, было к чему обращаться. Закрывающие тэги '</td></tr>' можно прописать "жестко", в неизменяемой области (а можно и вообще не прописывать
), а при создании новой ячейки оставлять их открытыми.Можно по разному решать этот вопрос.
_____________
Здесь расположена полная версия этой страницы.