5

ユーザーのニーズに基づいて複数のファイルアップロードを追加する機能が必要ですが、ユーザーは後で使用するためにアップロードに名前を割り当てることができる必要があります。ご覧のとおり、ファイルのアップロードを動的に追加しているだけですが、これらのアップロードに名前を割り当てるのは私の問題のようです。これを達成する方法はありますか?

現時点でのスクリーンショット

私のビューのコード:

@using Microsoft.Web.Helpers
@model MusicNews.Web.Models.ViewModel.ArticleCreateModel

@{
    ViewBag.Title = "Create";
}

@section content
{

        @using (Html.BeginForm("Create", "Article", FormMethod.Post,
                      new { enctype = "multipart/form-data" }))
        {
                ...

                @FileUpload.GetHtml("Files",2,true,false,"Add more")

                <p>
                    <input type="submit" value="Create" />
                </p>
        }
}

私のコントローラーのコードは次のようになります:

[Authorize]
public ActionResult Create()
{
    ViewBag.ArticleTypes = new SelectList(ArticleTypes, "Type");
    return View();
}


[HttpPost]
[Authorize]
public ActionResult Create(ArticleCreateModel article)
{
    var files = Request.Files;

    if (ModelState.IsValid)
    {
        ...
    }
    return View(article);
}
4

1 に答える 1

4

おそらく、自分で追加のアップロードを作成する必要があります。これは、jQueryを使用して実行できます。次に例を示します。

HTMLは次のとおりです。

<div id="uploads">
    <div id="uploadtemplate">
        <input type="file" name="upload" />
        <input type="text" name="FileName" />
    <div>

    <a href="#" id="addFile">Add file</a>
</div>

ロード時に、後で使用するために変数に「テンプレート」のクローンを作成します。クリックすると、テンプレートのクローンが作成され、ドキュメントに追加されます。

$(function() {/
    $('#addFile').data('uploadtemplate', $('#uploadtemplate').attr('id', '').clone());

    $('#addFile').click(function(e) {
        $(this).data('uploadtemplate').clone().insertBefore( $this) );

        e.preventDefault();
    });
});

モデルは次のようになります。

public class Foo {
    public string[] FileName { get; set; } // will contain all file names given by the user
}

次に、Request.Filesを解析し、知っている魔法を実行します:-) Foo.FileNameフィールドには、アップロードされたすべてのファイルに対してユーザーが指定したファイル名が含まれます。これをRequest.Filesの最初のファイルがFoo.FileName[0]などにマップされるので使用できます。

于 2012-12-31T08:53:56.023 に答える