使用帶有來自數據庫的值的下拉框添加新行使用javascript？

Question

在我的頁面中，我嘗試添加一個新行，其中包含一個包含數據庫值的下拉列表。 為此，我使用Javascript和ajax，但是當我單擊添加新行按鈕時，它正在完美地添加第一行，但是當我為第二行按下相同按鈕時，添加了一行，但下拉菜單為空。 你能幫幫我嗎？

  function addworkexp(row) { var rowcount = $("#rowcount").val(); var i; var row1 = "<tr><td style='border: 0px;'><input type=\\"text\\" class=\\"form-control selectbxwidthsmall\\" name=\\"employer[]\\"></td>"; row1 += "<td style='border: 0px;'><input type=\\"text\\" class=\\"form-control selectbxwidthsmall\\" name=\\"jobtitle[]\\"></td>"; row1 += "<td style='border: 0px;'><select style=\\"display: inline-block;width: 80px;\\" onchange=\\"calculate('" + row + "')\\" id=year_from_" + row + " class=\\"form-control selectbxwidthsmall\\" name=\\"year_from[]\\">"; row1 += "<option value=\\"\\">Select</option>"; for (i = 1994; i < 2014; i++) { row1 = row1 + "<option value=" + i + ">" + i + "</option>"; } row1 += "</select>"; row1 += "<span style=\\"display: inline-block;\\">TO</span>"; row1 += "<select style=\\"display: inline-block;width: 80px;\\" onchange=\\"calculate('" + row + "')\\" id=year_to_" + row + " class=\\"form-control selectbxwidthsmall\\" name=\\"year_to[]\\">"; row1 += "<option value=\\"\\">Select</option>"; for (i = 1994; i < 2014; i++) { row1 = row1 + "<option value=" + i + ">" + i + "</option>"; } row1 += "</select>" row1 += "</td>"; row1 += "<td style='border: 0px;'><select class=\\"form-control\\" id=industry_" + row + " name=\\"industry[]\\"></select></td>"; $.ajax({ type: "POST", url: "../server/getindustry.php", success: function(data) { $("#industry_" + row + "").html(data); } }); row1 += "<td style='border: 0px;'><input type=\\"text\\" class=\\"form-control\\" id=total_exp_" + row + " name=\\"total_exp[]\\"></td></tr>"; $("#workexp").append(row1); rowcount = parseFloat(rowcount) + 1; $("#rowcount").val(""); $("#rowcount").val(rowcount); } 

 <table id="workexp" class="table"> <tr> <td style="border: 0px;padding-bottom: 0px;"> <b><?php echo $jbs_workexp_emp_lang; ?><span class="text-error">*</span></b> </td> <td style="border: 0px;padding-bottom: 0px;"> <b><?php echo $jbs_workexp_jobtitle_lang; ?><span class="text-error">*</span></b> </td> <td style="border: 0px;padding-bottom: 0px;"> <b><?php echo $jbs_workexp_duration_lang; ?></b> </td> <td style="border: 0px;padding-bottom: 0px;"> <b><?php echo $jbs_workexp_indus_lang; ?></b> </td> <td style="border: 0px;padding-bottom: 0px;"> <b><?php echo $jbs_workexp_totexp_lang; ?><span class="text-error">*</span></b> </td> </tr> <?php for ($row = 0; $row < $rowcount; $row++) { ?> <tr id="work_<?php echo $row; ?>"> <td style="border: 0px;padding-bottom: 0px;"> <?php $emparr = explode(",", $employercheck); ?> <input class="form-control selectbxwidthsmall" type="text" name="employer[]" value="<?php echo $emparr[$row]; ?>"><br> <span class="text-error" ><?php echo $error_msg['employer'][$row]; ?></span> </td> <td style="border: 0px;padding-bottom: 0px; width: 134px;"> <?php $jobarr = explode(",", $jobcheck); ?> <input class="form-control selectbxwidthsmall" type="text" name="jobtitle[]" value="<?php echo $jobarr[$row]; ?>"><br> <span class="text-error" ><?php echo $error_msg['jobtitle'][$row]; ?></span> </td> <td style="border: 0px;padding-bottom: 0px;"> <?php $yearfromarr = explode(",", $yearfromcheck); ?> <select onchange="calculate('<?php echo $row ?>')" id="year_from_<?php echo $row; ?>" name="year_from[]" class="form-control" style="display: inline-block;width: 78px;"> <option value="">Select</option> <?php for ($i = 1994; $i < 2014; $i++) { ?> <option value="<?php echo $i; ?>" <?php if ($i == $yearfromarr[$row]) echo "selected"; ?> ><?php echo $i; ?></option> <?php } ?> </select> <span style="display: inline-block;">TO</span> <?php $yeartoarr = explode(",", $year_tocheck); ?> <select onchange="calculate('<?php echo $row; ?>')" id="year_to_<?php echo $row; ?>" class="form-control selectbxwidthsmall" name="year_to[]" style="display: inline-block;width: 78px;"> <option value="">Select</option> <?php for ($i = 1994; $i < 2014; $i++) { ?> <option value="<?php echo $i; ?>"<?php if ($i == $yeartoarr[$row]) echo "selected"; ?>><?php echo $i; ?></option> <?php } ?> </select> <br> <span class="text-error" > <?php echo $error_msg['yearfrom'][$row]; ?></span> <span class="text-error" ><?php echo $error_msg['yearto'][$row]; ?></span> </td> <td style="border: 0px;padding-bottom: 0px; width:104px;"> <?php $industryarr = explode(",", $industrycheck); ?> <select name="industry[]" id="industry_<?php echo $row; ?>" class="form-control"> <option value="">Select</option> <?php for ($h = 1; $h <= count($industry_id); $h++) { ?> <option value="<?php echo $industry_id[$h]; ?>" <?php if ($industry_id[$h] == $industryarr[$row]) { echo "selected"; } ?>> <?php echo $industry[$h]; ?></option> <?php } ?> </select> </td> <td style="border: 0px;padding-bottom: 0px; width:72px;"> <?php $totalexparr = explode(",", $totalexpcheck); ?> <input type="text" id="total_exp_<?php echo $row; ?>" name="total_exp[]" value="<?php echo $totalexparr[$row]; ?>" class="form-control" style="width:72px;"> </td> <td style="border: 0px;padding-bottom: 0px;"> <?php $workid = explode(",", $workidheck); ?> <a href="javascript:void(0)" onclick="DelWorkexp('<?php echo $row; ?>', '<?php echo $workid[$row]; ?>')" class="btn btn-danger">Delete</a> </td> </tr> <?php } ?> </table> <table class="table"> <tr> <td style="border: 0px;padding-bottom: 0px;"><a href="javascript:void(0)" class="btn btn-primary" onclick="addworkexp('<?php echo $row; ?>')">Add Work Experience</a></td> </tr> <tr> <td style="border: 0px;padding-bottom: 0px;"> <input type="hidden" name="rowcount" id="rowcount" value="<?php echo $rowcount; ?>"> <center> <input class="btn btn-primary" type="submit" name="save" value="Save"> </center> </td> </tr> </table> 

Answer 1

嘗試在ajax調用之前先添加行。

$("#workexp").append(row1);
$.ajax({
    ...
});

這將確保此次通話

$("#industry_" + row + "").html(data);

將成功找到下拉列表添加數據的位置。

你有任何javascript錯誤或php錯誤？