在Ajax .html函数中循环

时间:2018-06-24 16:54:38

标签: javascript jquery

为了基于API响应和数组中的数据构建html表单,我希望能够在.html Ajax函数内循环以构建表单的Select项。

这是代码:

            success: function(resultData) {

              var element = $(resultData)[0]; 

                $('#form_data').html(

                `
                        <div class="form-row">
                            <div class="form-group col-md-4">
                                <label class="control-label">Date Reunion</label>
                                <input type="text" id="R_date" class="form-control" value="` + element.dateReunion + `">
                            </div>
                            <div class="form-group col-md-4">
                                <label class="control-label">Hour Reunion</label>
                                <input type="time" id="R_hour" class="form-control" value="` + element.heureReunion + `">
                            </div>
                            <div class="form-group col-md-4">
                                <label class="control-label">Amount Reunion</label>
                                <input type="number" id="R_amount" class="form-control" value="` + element.montantReunion + `">
                            </div>
                            <div class="form-group col-md-12">
                              <label for="exampleFormControlSelect1">Place Reunion</label>
                              <select class="form-control" id="exampleFormControlSelect1">`
                              +
                                for (var i=0;i<datasetPlace.length;i++){

                                  $('#exampleFormControlSelect1').append($(
                                  `<option>` + datasetPlace[i].nomLieu + `</option>`
                                  ));
                                }
                              +
                              `</select>                                    
                            </div>
                            <div class="form-group col-md-4">
                                <label class="control-label">Manager Reunion</label>
                                <input type="text" id="R_manager" class="form-control" value="` + element.fk_idOrganisateur + `">
                            </div>
                            <div class="form-group col-md-4">
                                <label class="control-label">Treasurer Reunion</label>
                                <input type="text" id="R_treasurer" class="form-control" value="` + element.fk_idTresorier + `">
                            </div>
                            <div class="form-group col-md-4">
                                <label class="control-label">Secretary Reunion</label>
                                <input type="text" id="R_secretary" class="form-control" value="` + element.fk_idSecretaire + `">
                            </div>
                            <div class="form-group col-md-12">
                                <button type="button" class="btn btn-primary" onclick="editEvent(` + element.idReunion + `);">Edit Record</button>
                                <button type="button" class="btn btn-secondary" onclick="formEventReturn();">Return</button>
                            </div>
                        </div>
                `
                );
      },

但是它不起作用,我该如何解决?

0 个答案:

没有答案