Как отобразить список форм div, следовательно, javascript

ОК. поэтому я пытаюсь создать форму, так что, когда я на кнопке «+» появляется новая форма под существующей. Например, у меня есть форма для заполнения имени

VoteType name: [ ] {+} -- (button) 

при нажатии «+» форма будет выглядеть так:

 VoteType name: [ ] Vote1 name [ ] image [ ] date [ ] {+} -- (button) 

и кнопку «+», чтобы я мог добавить Vote2 … столько, сколько захочу.

Поэтому я сделал эту форму, покупая, когда пытаюсь их пронумеровать, цифры не идут так, как я предполагал.

 
{%csrf_token %}

{{ voteTypeForm }}

Candidate No
{%csrf_token %} {{ voteForm.as_p}}

var _counter = 0; function Add() { _counter++; var oClone = document.getElementById("template").cloneNode(true); oClone.id += (_counter + ""); document.getElementById("placeholder").appendChild(oClone); document.getElementById("someInput").value = _counter; }

Когда я нажимаю кнопку +, он создает формы, но цифры их следующие:

4 [пусто] 1 2 3

вместо

1 2 3 4 5

Я пытался каким-то образом скрыть местозаполнитель, используя style "none" , но не показал ни одного из них, но я попытался активировать его, только когда счетчик больше 1, но он снова показал первый. Обычно я не использую javascript, поэтому, пожалуйста, помогите. Как я могу это решить?

Что касается скрытия шаблона, вы можете использовать видимость: скрытый, чтобы поддерживать узлы в DOM, чтобы вы могли их выбирать. Кроме того, если вы можете использовать тег, используйте это. Последней альтернативой является создание шаблона в вашем javascript и сохранение узла, который вы хотите клонировать в переменной, вместо того, чтобы хранить его в DOM.

Пока не выяснили, почему счетчик id работает неправильно.

 var tmp = document.createElement('div'), template; tmp.innerHTML = '

Candidate No
{%csrf_token %}{{ voteForm.as_p}}

'; template = tmp.innerHTML;

Это самый маленький способ, которым я мог бы набрать его. Возможно, вам придется сменить php? жерех? код внутри действия формы.

Итак, у меня было несколько вопросов. Один из них заключался в том, что цифры не отображались корректно, а другая, что я не хотел, чтобы моя форма отображалась без нажатия кнопки [+]. поэтому я решил сохранить html-код кода в javascript. Я не знал, как использовать этот код для добавления его в html-код, потому что функция appendchild требует узла как аргумента, а не строки. Чтобы решить эту проблему, я нашел этот вопрос в stackoverflow .

Для остальных здесь мой код решения:

 {% load staticfiles %}  
{%csrf_token %}

{{ voteTypeForm }}