时间戳

首页 > 解决方案 > 如何使用ajax将数据从动态添加的表单发送到php

php - 如何使用ajax将数据从动态添加的表单发送到php

问题描述

我创建了一个动态表单，其中包含来自 MySQL 数据库的数据，并且效果很好。问题是，我不知道如何让 ajax 读取表单。

假设下面的代码是一个单一的形式：

<form>
    <!-- input type content here -->
</form>

它的等效 ajax 代码将是：

$(document).ready(function(

    $.ajax({
        url: 'url',
        data: $("#frm").serialize();
       //insert more code...
});

))

如果我的表单是这样动态添加的怎么办：

<?php while($row = $result->fetch_assoc()){
    <!-- insert code for dynamic grid see sample link [here][1]  
    <form>
       <input type="radio" name="rate" value="1">
       <input type="radio" name="rate" value="2">
       <input type="radio" name="rate" value="3">

       <input type="text" name="name" value="<?php echo $row['p_name']?>"
       <input type="text" name="price" value="<?php echo $row['p_price']?>"
    </form>

}?>

如果我的表单是动态创建的，我将如何获取这些数据？我什至必须在我的表单中添加一个数组符号，例如<form name="myFrm[]"？如果是这样，我什至怎么称呼它为ajax？

标签： phpjqueryajaxmysqli

解决方案

请尝试以下解决方案。

使用自动增量变量动态设置表单 ID。

<?php $i=1; while($row = $result->fetch_assoc()){
<!-- insert code for dynamic grid see sample link [here][1]  
<form id="frm<?php echo $i;?>">
   <input type="radio" name="rate" value="1">
   <input type="radio" name="rate" value="2">
   <input type="radio" name="rate" value="3">

   <input type="text" name="name" value="<?php echo $row['p_name']?>">
   <input type="text" name="price" value="<?php echo $row['p_price']?>">
  <input type="button" name="button" value="click" class="common_submit_btn">
</form>
$i++; 
}?>

下面是用于在 ajax 中获取动态表单 ID 的 JavaScript 代码。

$(document).ready(function(
  $(".common_submit_btn").click(function(){
  //here you can get submitted form data in console.
  console.log($('#'+$(this).closest('form').attr('id')).serialize());
  $.ajax({
    url: 'url',
    data: $('#'+$(this).closest('form').attr('id')).serialize(),
   //insert more code...
 });
});
});

推荐阅读