是否可以将选择的输入与来自数据库的值一起放入动态添加/删除输入字段中?

时间:2019-05-02 01:15:41

标签: php jquery

我正在为我的项目创建“动态添加/删除”输入字段。列之一具有输入的选择类型,并且选项需要来自数据库中的表。它在第一行上运行良好,但是当我需要添加更多字段时,它不起作用。可以在jQuery的.append函数上放置php代码吗?

我尝试对.append函数的第一行进行相同的处理,但是当我添加更多字段时,它什么也没有添加。当我删除php代码时,它可以正常工作,但不能使用数据库中的选项。我不知道在追加功能中显示数据库中的值时是否出现语法错误。

<?php
   <tr>                       
    <td>
      <select class="form-control" name="procedures[]">
        <?php 
            $sql = "SELECT * FROM services";
            $result = mysqli_query($conn, $sql);
            while($row = mysqli_fetch_array($result))  
              {  
               echo '<option>'.$row['s_name'].'</option>
                    ';
              }
  ?>
      </select> 
    </td>
    <td><input type="text" name="description[]" placeholder="Description" class="form-control name_list" /></td>
    <td><input type="text" name="amount[]" placeholder="Amount" class="form-control name_list" /></td>  
   <td><button type="button" name="add" id="add" class="btn btn-success">+</button></td>  
  </tr>

这是添加函数,可以像上面的行格式一样添加更多文本字段。

  <script>  
  $(document).ready(function(){  
  var i=1;  
  $('#add').click(function(){  
       i++;  
       $('#dynamic_field').append('<tr id="row'+i+'"><td><select class="form-control" name="procedures[]"><?php $sql="SELECT * FROM services"; $result=mysqli_query($conn,$sql); while($row=mysqli_fetch_array($result)){ echo "<option>'".$row['s_name']."'</option>";}?></select> </td><td><input type="text" name="description[]" placeholder="Description" class="form-control name_list" /></td><td><input type="text" name="amount[]" placeholder="Amount" class="form-control name_list" /></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">x</button></td></tr>');  
  });  
  $(document).on('click', '.btn_remove', function(){  
       var button_id = $(this).attr("id");   
       $('#row'+button_id+'').remove();  
  });  
  $('#submit').click(function(){            
       $.ajax({  
            url:"name.php",  
            method:"POST",  
            data:$('#add_name').serialize(),  
            success:function(data)  
            {  
                 alert(data);  
                 $('#add_name')[0].reset();  
            }  
       });  
  });  
 });  
 </script>  

我希望我可以与第一行相同地添加更多输入字段,第一行具有一列select输入,其中包含来自数据库表的选项。 Click here to see the image

0 个答案:

没有答案