Question

这是我的表格：

<FORM id="webgrants" NAME="webgrants" action="updateDashPermissions.do" method="post" target="hidden-form">
<input type="hidden" name="property(userId)" value="">
<input type="hidden" name="property(dashboardSettings)" id="dashboardSettings" value="1">
</FORM>

在阅读提交表单到隐藏的iframe后，我意识到每次我想发布表单时都需要删除并重新创建iframe。这是执行此操作的JavaScript：

function deleteIframe() {
    $("#hidden-form").remove();
}

function sendSubmit() {  /*Called when checkbox checked*/

  var my_iframe = $('<IFRAME style="display:none" name="hidden-form" id="hidden-form"></IFRAME>');
  $('body').append(my_iframe);
  document.forms[0].submit();
  var t = setTimeout(deleteIframe, 2000);
}

但是，隐藏的iframe未被删除，只有最新的表单提交正在处理中。有没有办法删除iframe所以表单将提交将被处理？或者是否有更有效的方式将同一表单多次发布到iframe？

Answer 1

您可以使用常规的Form元素，使用JQuery，而不需要任何iFrame。

<!doctype html>
<html lang="en">
<head>     
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<form action="updateDashPermissions.do" method="post" id="searchForm">
  <input type="text" name="s" placeholder="Search...">
  <input type="submit" value="Search">
</form>
<!-- the result of the search will be rendered inside this div -->
<div id="result"></div>

<script>
// Attach a submit handler to the form
$( "#searchForm" ).submit(function( event ) {

  // Stop form from submitting normally
  event.preventDefault();

  // Get some values from elements on the page:
  var $form = $( this ),
    term = $form.find( "input[name='s']" ).val(),
    url = $form.attr( "action" );

  // Send the data using post
  var posting = $.post( url, { s: term } );

  // Put the results in a div
  posting.done(function( data ) {
    var content = $( data ).find( "#content" );
    $( "#result" ).empty().append( content );
  });
});
</script>

</body>
</html>

甚至更简单的方法是使用JQuery.POST将任何数据发布到服务器端“updateDashPermissions.do”。

$.post( "updateDashPermissions.do", { userID: "John", dashboardSettings: "2pm" } );

或者您可以使用JQuery插件“jQuery Form Plugin”，此插件允许您轻松且不引人注意地升级HTML表单以使用AJAX。主要方法ajaxForm和ajaxSubmit从表单元素收集信息，以确定如何管理提交过程。这两种方法都支持多种选项，使您可以完全控制数据的提交方式。使用AJAX提交表单并不比这更容易！

http://jquery.malsup.com/form/

的引用：

将表单多次发布到隐藏的iframe

1 个答案: