1

重複の可能性:
iframe 内に html を配置する (javascript を使用)

私は次のコードを使用していますが、本質的にやりたいこと (jquery は初めてです) は、このフォームを送信することですが、uploadpic.php ページに通常出力されるものをフォームがあるこのページに表示します。 iframeで。私はそれを行う方法を理解することはできません。Jquery フォーム プラグインを追加しました - http://www.malsup.com/jquery/form/ コードを調べて、現在の動作についてコメントしました。しかし、その iframe 交換を追加する方法がわかりません。基本的に、uploadpic.php はこれを行います。

$add_one = $membership->add_photo($_POST['photo'], $_POST['caption']);

すべてが正常に送信された場合、または失敗した場合は、「ファイルがアップロードされませんでした」または「ファイルが正常にアップロードされました。

新しいページに移動したり、イライラするポップアップに頼ったりするのをやめるにはどうすればよいですか? 一時的な iframe は良いアイデアだと思いましたが、そのようなものを実装する方法がわかりません。

<div id="uploadform">
            <form id = "uploadpicform" enctype="multipart/form-data" action="uploadpic.php" method="POST"> 
            <p>Photo: </p><input type="file" name="photo"><br />
            <p>Caption:</p> My <input type="text" name="caption"><br />
                   <input type="submit" class="large blue button" value="Add"> 
            </form>
            <script>
            // wait for the DOM to be loaded
            $(document).ready(function() {
                // bind 'myForm' and provide a simple callback function
                $('#uploadpicform').ajaxForm(function() {
                $("#hideuploadbutton").hide();
                $("#uploadbutton").show();
                $("#uploadform").hide();
                });
            });             
            </script>
        </div>

現時点では、通知なしでフォームを送信し、アップロード ボタンを非表示にして、プロセスを再開するための開いているアップロード ボタンを表示します。「iframe を追加」または「他のページから php 変数を印刷」オプションか何かが必要だと思います。

助けていただければ幸いです。ありがとうございます。

4

1 に答える 1

0

EDITED iframe に入力するための追加コード

HTML

<form id="uploadpicform">

    <p>Photo:</p>
    <input type="file" name="photo"><br />
    <p>Caption:</p>
    <input type="text" name="caption"><br />

</form>


<div id="uploadpicbutton" class="bluebutton">Upload</div>

JQuery

// **ADDED** Populate the iframe 
function iframeresults() {  

    var content = phpresults;
    var tFrame = document.getElementById("iframeid");
    var doc = tFrame.contentDocument;
    if (doc == undefined || doc == null)
        doc = tFrame.contentWindow.document;
    doc.open();
    doc.write(content);
    doc.close();

}

//Submit Upload Ajax Call Function

function submit_upload() {

    $('#status').html('Uploading, Please Wait').fadeIn(500);

    $.ajax({
        type: "POST",
        url: "/uploadpic.php",
        cache: false,
        data: $('#uploadpicform').serialize(), //This adds the variable name and input values automatically
        dataType: "script", // Returns Javascript outputted from PHP page and Launches the Script
        success: function(){

        iframeresults();

    });        

}

// Bind the upload function to the button    
$('#uploadpicbutton').on('click', submit_upload);

PHP

 //Use this echo in your PHP after your PHP Successful validation
 echo "var phpresults = 'Upload Succesful'; ";

 //Use this echo in your PHP after your PHP Failure validation
 echo "var phpresults = 'Upload Failed'; ";
于 2012-11-03T03:07:46.873 に答える