カスタムモーダルフォームからサブミットボタンを模倣する方法

Question

グリッドからデータを編集するためのグリッドデータ（index.php）とカスタムモーダルフォーム（frmbts.php）を表示するフォームがあります。私は、モーダルフォームからデータを送信/投稿する方法を知らないし、jqgridのフォームの追加/編集のように送信した後、モーダルフォームを閉じます。 frmbts.phpに送信ボタンを置くとデータを送信できます。しかし、それは私が達成したい（私は提出後にモーダルフォームを閉じることはできません）。ここ

は、グリッドのコード（index.phpを）

jQuery(document).ready(function(){ ... 
     jQuery("#list").jqGrid('navGrid','#page',{edit:true,add:true,del:true,search:true,refresh:true,position:'right', 
      editfunc: function(id){ 
       jQuery('#frmbts').load('frmbts.php?id='+id); 
       jQuery('#frmbts').dialog({width:670,height:550,modal:true,title:'Edit Data', 
       buttons: { "Cancel": function() { 
        jQuery(this).dialog("close"); 
       }, "Save": function() { <-- i want use this to submit data 
        //code to submit the form then close the form 
        jQuery(this).dialog("close"); 
       } }, 
       }); 
      }}, ... 
    <div id="content"> 
     <form id="frm" method="post" action="csvExport.php"> 
      <div id="frmbts"></div> 
      <table id="list"></table> 
      <div id="page"></div> 
      <input id="csvBuffer" name="csvBuffer" type="hidden" value=""> 
      <input id="typeinfo" name="typeinfo" type="hidden" value=""> 
     </form> 
    </div> 

は、[OK]をモーダルフォームコード（frmbts.php）

<?php 

    $id = $_REQUEST['id']; 

    if(isset($_POST['submit'])) 
    { 
    //update data 
    } 
?> 

<form name="frmsubmit" method="post" action="frmbts.php"> 
    <table>...</table> 
    <input type="button" name="cancel" value="cancel">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
    <input type="submit" name="save" id="save" value="Save"> <--- just test. not the way i want 
</form> 

Answer 1

あるので、あなたは、フォームを送信しますがで滞在したいです同じページをページリロードせずに閉じ、モーダルdivを閉じます。これにはajaxを使用する必要があります。

まず第一に、通常のボタンにボタンを提出し、これを使用変更、その後、フォームのidのにすべての名前のを変更：私は理解していない何

$.post('frmbts.php', { 
    cancel: $('#cancel').value(), 
    save: $('#save').value() 
}, function(response) { 
    // close your modal div here. 
}); 

は、あなたがするので、あなたのフォームを表示する方法であります私はそれがfrmbts.phpの中で定義されていることを知っているので、そうすることはちょっと変です。新しいPHPを使ってPOSTデータのみを処理し、JSONとAJAXという意味のビットを学ぶと、jQueryにはこのための多くの機能があり、とても簡単で強力です。

これは、あなたのPOST処理コードを新しいPHPの中に入れて、PHPがいくつかのJSON応答をエコーするようにして、$ .post呼び出しが、そのプロセスが成功したか、あなたの投稿に応じて取得したい他のデータが含まれています。また、MVCが何であるかを見てください。

Answer 2

右のように、frmbts.phpからモーダルポップアップウィンドウにロードしていますか？私はjQueryで送信された入力を確認して、クリックしたかどうかを確認し、代わりに以下のようなものを呼び出します。私はあなたの新しいフォームにID値 "frmbtsform"を与えました。これを変更して、テストしてください！