Member 12645050 Ответов: 1

Как вставить текстовое поле в div, который создается из цикла


Я использую плагин javascript jquery, который создает поле выбора и поле ввода. У меня есть он внутри цикла for, который реплицирует поле выбора и ввода для количества раз, когда оно повторяется. То, что я пытаюсь сделать, это то, что пока он находится в цикле, каждый раз, когда создается поле выбора и ввода, он бросается внутрь div с уникальным идентификатором, конечно.

Ниже приведено мое объяснение и то, где я сейчас нахожусь, ценю любую помощь.

Что я уже пробовал:

for(i=0; i<Qty; i++)
{
   var newDiv = document.createElement('div'); //created the div for each iteration
   newDiv.id = 'd'+ i; //created a div id for each iteration 
   newDiv.className = 'myClass'; //created a class
   form.render();//this function creates the select box and input box
   /*I am stuck here not exactly sure how I am suppose to take the form.render()
        and place it into the created div.*/

}

F-ES Sitecore

Итак, вы хотите, чтобы люди помогли вам использовать функцию, для которой вы не показали код или не объяснили, как она работает?

Посмотрите на использование Клон- это , наверное, проще, чем то, что ты делаешь.

Member 12645050

Здравствуйте, я буду исследовать клон, но даже если я напишу код для создания поля ввода и выбора, я все равно застряну в той же ситуации, в которой создаются два поля, но не помещаются в div.

F-ES Sitecore

Вы бы использовали "добавить" или что-то подобное. Ссылка, которую я дал, содержит примеры этого, и большинство примеров, которые вы найдете, которые используют clone with, показывают что-то подобное, поскольку вам всегда нужно поместить элемент *где-то* после его клонирования.

1 Ответов

Рейтинг:
6

Karthik_Mahalingam

обратитесь к этому образцу

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <style>
        .myClass{
            width:500px;
            border:1px solid red;
            padding:5px;
        }
        
    </style>
    <title></title>
    
</head>
<body>
    <script>
        var Qty = 5;
        for (i = 0; i < Qty; i++) {
            debugger
            var newDiv = document.createElement('div');
            document.body.appendChild(newDiv);
            newDiv.id = 'd' + i;
            newDiv.className = 'myClass';
            var input = document.createElement('input');
            input.type = "text";
            input.id = "txt" + i;
            newDiv.appendChild(input);
             

            var select = document.createElement("select");
            select.id = "select" + i;
            newDiv.appendChild(select); 
            var items = ["option1", "option2", "option3"];
            for (var j = 0; j < items.length; j++) {
                var option = document.createElement("option");
                option.value = items[j];
                option.text = items[j];
                select.appendChild(option);
            }

        }
    </script>

</body>
</html>


Демонстрация Плунжер[^]