2016-09-16 5 views
0

に、フォームの複数の時間を投稿することここに私のフォームです:が非表示のiframe

<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に私が望んでいたたびに削除して再作成する必要があります実現しましたフォームを投稿する。

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に投稿する方が効率的な方法はありますか?

答えて

1

iFrameをまったく必要とせずに、JQueryを使用して、通常のフォーム要素を使用して同じことを行うことができます。

<!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> 

、あるいは簡単な方法は、サーバー側「updateDashPermissions.do」に任意のデータを投稿するJQuery.POSTを使用することです。

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

それとも、jQueryのプラグイン「jQueryのフォームプラグイン」を使用することができますが、このプラグインを使用すると、簡単かつ控えめにAJAXを使用するためのHTMLフォームをアップグレードすることができます。主要なメソッドajaxFormとajaxSubmitは、フォーム要素から情報を収集して、送信プロセスの管理方法を決定します。これらの方法はどちらも、データの送信方法を完全に制御できるようにするさまざまなオプションをサポートしています。 AJAXでフォームを送信してもこれより簡単にはなりません!

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

参照:

+1

第1のコードセグメントは動作しませんでしたが、2番目は完全に働きました。ありがとうございました! – Turtle

関連する問題