Question

我有一个表，这个表中的每一行都是一个表单，表在第一个代码部分（重置函数）中使用AJAX异步刷新，我需要同步提交表单，因为html函数在成功部分，提交代码（点击）将调用fpdf实例并在iframe中显示结果。提交将正常运行，直到我刷新或添加新行，表单将不会同步提交。

重置功能：

function reset() {

$.ajax({
url : 'php_file.php',
type : 'post',
data : {reset: 1},

success : function(response) {

    $( "#datagrid" ).remove();
    $('#datagrid_div').html(response);

    }
 });
}

提交功能：

$(document).on("click", ".submit_Btn", function(){

      var index = $(this).prop("value");

      var values = {};

      values['key_'+index] = $('#key_' + index).val();

      $.post('php_file.php', values,function(result){

      $("#PDF_Div").show();
 });

 return 0;
});

我在这个网站上尝试了太多的答案，但没有一个能帮助解决这个问题。

html部分如下所示：

<input type='button' onclick='reset();'/>
<div id='datagrid_div'>

  <table id='datagrid'>
  <tr>
  <form target="pdf_frame" method="POST" action="php_file.php">
<td>info_1</td>
  <input type='hidden' id='key_1'/>
  <input type='submit' class='submit_Btn' value='1'/>
  </form>
  </tr>
  </table>
</div>

Answer 1

我看不出它是如何起作用的......

我看不到调用reset（）的位置
如果调用reset（），$（“＃datagrid”）。remove（）;删除表单再次提交
表格语法错误。你有一个tr标签，但没有td标签，所以表格标签可能会在表格标签后被推到。
表单标记引用action =“php_file.php”，这意味着单击提交按钮将（如果表单被正确读取/呈现）将数据发布到php_file.php，并且不使用您的jquery ajax调用，这意味着ajax成功通话也不会执行。

建议的更改：将表单标记放在表格之外。由于您希望ajax执行表单提交，因此请避免在表单标记中引用它。

<div id='datagrid_div'>
  <form>
  <table id='datagrid'>
  <tr><td>    
  <input type='hidden' id='key_1'/>
  <input type='submit' class='submit_Btn'/>
  </td>
  </tr>
  </table>
  </form>
</div>

我不清楚你为什么要把一个提交按钮作为一个类引用 - 如果提交按钮出现多次，那么所有按钮都会被选中，因此会发布几个调用。

<script>
$(document).on("click", ".submit_Btn", function(){

      var index = $(this).prop("value");

      var values = {};

      values['key_'+index] = $('#key_' + index).val();

      $.post('php_file.php', values,function(result){

      $("#PDF_Div").show();
 });

 return 0;
});
</script>

我不确定如何指导PDF在iframe中打开。我会先着手在iframe中显示单个文本值，然后再确定如何让PDF出现在那里。

AJAX动态添加的表单不提交

1 个答案: