如何将div容器添加到数组js

时间:2017-08-24 21:58:01

标签: javascript jquery arrays arraylist dynamic-arrays

有一个由两部分组成的表格。第一部分是订单的基本信息。表单的第二部分由容器的添加div组成。用户可以通过单击按钮添加容器的第二部分。我无法理解如何将表单的第二部分添加到不同位置的数组中。 单击“提交”按钮时,必须创建到数组:

{'user': xxx, 'Phone ': xxx,' voucher': xxx, etc...}
{'user': xxx, 'Phone ': xxx,' voucher': xxx, etc...}
{'user': xxx, 'Phone ': xxx,' voucher': xxx, etc...}

这是形式两部分。 用户可以添加另一个div容器

<div data-container="set">
                <div data-item="set">
                    <h3>Участник</h3> 
                    <div class="row">
                        <div class="col-sm-12 col-md-12 col-lg-3">
                            <div class="form-group">
                                <label>ФИО участника</label>
                                <input type="text" class="form-control " name="fio" id="fio" value=""> </div>
                        </div>
                        <div class="col-sm-12 col-md-12 col-lg-3">
                            <div class="form-group"> <label>Телефон участника</label> <input type="text" class="form-control " name="phone[]" id="phone"> </div>
                        </div>
                        <div class="col-sm-12 col-md-12 col-lg-3">
                            <div class="form-group"> <label>E-mail участника</label> <input type="email" class="form-control " name="email[]" id="email"> </div>
                        </div>
                        <div class="col-sm-12 col-md-12 col-lg-3">
                            <div class="form-group"> <label>Номер купона</label> <input type="text" class="form-control " name="voucher[]" id="voucher" > </div>
                        </div>
                    </div>
                    <div id="form-messages"></div>
                    <div class="row">
                        <div class="col-sm-12 col-md-12 col-lg-9"><button type="button" data-action="remove" class="btn btn-danger">× Удалить участника</button></div>
                        <div class="col-sm-12 col-md-12 col-lg-3"><p name="sum[]"></p></div>
                    </div>
                    <input type="text" name="amount[]" value="1">
                    <input type="text" name="sum[]" readonly> 
                    <input type="text" name="osnovanie[]" id="osnovanie">
                    <input type="text" name="prinadl[]" id="prinadl"><br>
                    <hr>
                </div>
            </div>

1 个答案:

答案 0 :(得分:0)

帮助解决问题的解决方案

.on('click', '#payment', function(event) {  
   var d = document,
       user_fio = d.getElementsByName('fio[]'),
           user_phone = d.getElementsByName('phone[]'),
       //etc        
   mas = [];
  for(var i = 0; i< user_fio.length; i++){
     mas[i] = {
         'fio': user_fio[i].value,
         'phone': user_phone[i].value,
         //etc
         }
     }
 })