2

jqueryダイアログを使用してファイルをアップロードしたい。部分ビューを作成し、その部分ビューをダイアログに表示しました。

問題は、部分ビューを直接参照してファイルをアップロードすると、完全に機能することです。しかし、部分ビューをjqueryダイアログ内に配置すると、フォームは送信されますが、ファイルは送信されません。だから私はnull値を持っています。ここで何が違うのか本当にわかりません!!

誰かが私が問題を特定するのを手伝ってくれることを願っています。

ここにいくつかのコードがあります。

jqueryコード：

$('#UploadDialog').dialog({
        autoOpen: false,
        width: 580,
        resizable: false,
        modal: true,
        open: function (event, ui) {
        $(this).load('@Url.Action("Upload","Notes")');
        },
        buttons: {
            "Upload": function () {
                $("#upload-message").html(''); 
                $("#noteUploadForm").submit();
            },
            "Cancel": function () {
                $(this).dialog("close");
            }
        }
    });
    $(".uploadLink").click(function () {
        $('#UploadDialog').dialog('open');
        });
        return false;
});

部分ビュー：

@using (Ajax.BeginForm("Upload", "Notes", null, new AjaxOptions
{
UpdateTargetId = "upload-message",
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST",
OnSuccess = "uploadSuccess"
}, new { id = "noteUploadForm" , enctype="multipart/form-data"}))
{
<div>
<div id="upload-message"></div>
<div class="editLabel">
    @Html.LabelFor(m => m.Notes.NoteTitle)
</div>
<div class="editText">
    @Html.TextBoxFor(m => m.Notes.NoteTitle)
</div>
<div class="clear"></div>

<div class="editLabel">
    @Html.Label("Upload file")
</div>
<div class="editText">
    <input type="file" name="file" />(100MB max size)
</div>

</div>
}
4

3 に答える 3

1

これは、AJAXを使用してファイルをアップロードできないためです。

これを試して

http://jquery.malsup.com/form/#file-upload

于 2012-06-02T10:40:21.603 に答える
0

ajaxを介してファイルコンテンツを直接アップロードすることはできません。ファイルデータをシリアル化する必要があります。これを行うには、プラグインを使用するか、ファイルデータを手動でシリアル化する必要があります。いくつかの準備ができているプラ​​グインは次のとおりです。

  1. http://www.openjs.com/articles/ajax/ajax_file_upload/

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

次に、JQueryダイアログボックスが入力要素をフォームの外に移動することに注意してください。この質問を参照してください：

Jquery UIダイアログ内の入力が送信されていませんか？

送信する前に必ず要素を追加してください

于 2012-06-02T12:17:10.590 に答える
0

ajaxを使用してmultipart/form-dataを含むフォームを送信することはできません。そのためにいくつかのプラグインを使用する必要があります。

他の回避策（ajaxのような効果を得るため<iframe>）は、ビューでiframe（）を使用して非表示にし、フォームをこのiframeにターゲットとして投稿することです。必要に応じて、このようなフォームからダイアログを作成できます。

<form action="controller/action" method="post" target="iframename" id="yourformid">

これで、iframeで、loadイベントをバインドして、次のようにポストバックのステータスを確認できます。

 $('#iframename').load(function(){.......});
于 2012-06-02T16:37:35.547 に答える