メインウィンドウから入力した値をfancybox iframeに正しく送信する

Question

誰かが私を助けてくれるのだろうかと思っていました。私は単純な プラグインを使用してWordpressのPHPを使用して作成しました。これは、フォームが がFancyboxを使用して表示されます。.. に、ユーザが画像のキャプションとカスタムフィールドを追加することができますギャラリーだことが ボタンINPUT-クリックすることで開かれた...

編集機能は次のようになりますこの：

$(".edit").click(function() { 
    var formData = $(this).closest('form').serializeArray(); 
    formData.push({ name: this.name, value: this.value }); //this is 
to get the submit-buttons value 

    $.fancybox.showActivity(); 

    $.ajax({ 
     type  : "POST", 
     cache  : false, 
     url   : "<?php echo plugins_url(); ?>/upload/ 
editImageForm.php", 
     data  : formData, 
     success: function(data) { 
      $.fancybox(data); 
     } 
    }); 
    return false; 

}); 

編集フォームが、私は現在、隠しフィールドを通してそれを送る権利イメージ - 情報を編集するIMAGEIDを必要とするので。

私の問題は、私が提出する際 はインラインフレーム内に表示フォームのアクションページを編集し、形成するように、編集フォームは、 インラインフレーム内に表示させたいということです。現在のところ、フォームアクションページは、 メインウィンドウに読み込まれ、wordpress admin-areaから終了します。 iframeを編集フォームに使用するにはどうすればいいですか？フォームから入力値を送信するには メインウィンドウをfancybox-iframe（編集フォーム が入っています）に移動しますか？ fancyboxを開き、フォームのHTMLは次のようになり

、これは概要ページに次の各画像に表示されます。

削除ボタン上

<form method='post' action='' class="imageform"> 
    <input type='submit' value='Edit' name='edit' class="edit imageButton" /> 
    <input type='submit' value='Delete' name='delete' class="delete imageButton" onClick="return delete('<?php echo $image->name; ?>', '<?php echo $image->id; ?>')"/> 
    <input name='imageID' type='hidden' value='<?php echo $image->id; ?>' class="imageID" /> 
    <input name='imageNavn' type='hidden' value='<?php echo $image->name; ?>' class="imageNavn" /> 
</form> 

（削除機能はconfirm-を表示しますJavaScriptでのボックス、ユーザーは、彼/彼女は、画像を削除したい確信しているかどうかを尋ねる。）

追加画像形式は、ビットシンプルな作品、それが正しくべき、とiframe のように表示されている：

$("#upload").click(function() { 
    $.fancybox.showActivity(); 

    $.fancybox({ 
     'type'    : 'iframe', 
     'width'    : '50%', 
     'height'   : '75%', 
     'href'    : '<?php echo plugins_url(); ?>/upload/ 
addImage.php' 
    }); 

}); 

私の問題を理解して助けてくれることを願っています）

ありがとうございます！

Answer 1

iframeは（...）の痛みではなく、代わりにajaxを使用してください。できるだけjsonを使用するとより良い結果が得られます。

なぜですか？

1. のiframeは、クロスブラウザで動作するように難しいことができ、一部のユーザー
2. で無効にすることができる
3. バック切り替えることで、あなたの時間の多くを無駄にし、デバッグのか、開発する際に転送されます。

iframeを絶対に使用する必要がある場合は、$('iframe').attr('src',url);はiframe URLを変更します。もう一つの方法は、それ自体が、あなたがtop.windowかwindow.topないが、あまりにも必ず使用する必要がありますインラインフレームに続いて<a target="frame_name">とき<iframe name="frame_name">

を使用することです:)が、それはDOMに最上位のウィンドウを取得し、自らをiFrameにするために参照するためにself.windowを使用しています。これはいくつかの方法を

Answer 2

を助け

希望が作成され、IFRAMEの名前を設定する方法はないようです。

ファンシーフレームiframeを生成するコードです。作成したiframeを一意にするために現在の時間がかかります。

case 'iframe' : 
    $('<iframe id="fancybox-frame" name="fancybox-frame' + new Date().getTime() + 
     '" frameborder="0" hspace="0" scrolling="' + selectedOpts.scrolling + 
     '" src="' + selectedOpts.href + '"></iframe>').appendTo(tmp); 

私はこれをサポートするために我々のシステムを作るためにfancyboxするためのパッチ（おそらく些細な）を記述する必要があります。誰かがfancyboxメインラインに同じことをしたいと思っています。

私はfancyboxでファイルアップロードを行い、ウィンドウに移動してテストデータを自動的に入力するには、iframe名を知る必要があるため、この機能が必要でした。