6

Jasny へのリンクhttp://jasny.github.com/bootstrap/javascript.html#fileupload

フォームの外観へのリンクhttp://img507.imageshack.us/img507/3308/picpx.png

ブート ストラップ プロジェクトで Jasny Javascript ファイルのアップロードを使用しています。次のようになります。

ASP\HTML ビュー

<div class="row-fluid">
<div class="fileupload fileupload-new" data-provides="fileupload"><input type="hidden">
<div class="input-append">
<div class="uneditable-input span2" runat="server" id="statment1"><i class="icon-file  
fileupload-exists"></i> <span class="fileupload-preview" style=""></span></div><span 
class="btn btn-file"><span class="fileupload-new">Select file</span><span 
class="fileupload-exists">Change</span><input type="file"></span><a href="#" class="btn 
fileupload-exists" data-dismiss="fileupload">Remove</a>
</div>
</div>

C# asp.net ファイル アップロードを使用する場合と同様に、コード ビハインドでこれを使用して添付ファイルをサーバーに保存するにはどうすればよいですか?

ASP.net C# では、通常、コード ビハインドでこれを行います。

ASP.net C# コードビハインド 

string filename = FileUpload1.PostedFile.FileName;
FileUpload1.PostedFile.SaveAs(Path.Combine(Server.MapPath("\\Document"), 
filename).ToString());
                filelocation = "Document\\" + filename;
                media = "Document";

Jasny github は、ブートストラップを使用してレイアウトを設定する方法を説明していますが、これは見た目が非常に優れているため (退屈な asp ファイルのアップロードよりもはるかに優れています)、実際にボタン クリックで投稿するにはどうすればよいですか? 見栄えが良くなると思うので、これを機能させたいと思います。

4

1 に答える 1

10

標準のasp.netコントロールなしでこれを行いたいので、asp.netがあなたのために行ういくつかの配線を行う必要があります。

入力にIDがあることを確認してください。ここでは myFile に設定します。

<div class="row-fluid">
    <div class="fileupload fileupload-new" data-provides="fileupload"><input type="hidden">
        <div class="input-append">
            <div class="uneditable-input span2" runat="server" id="statment1">
                <i class="icon-file fileupload-exists"></i> 
                <span class="fileupload-preview" style=""></span>
            </div>
            <span class="btn btn-file"><span class="fileupload-new">Select file</span>
            <span class="fileupload-exists">Change</span><input id="myFile" type="file" runat="server">
            </span>
            <a href="#" class="btn fileupload-exists" data-dismiss="fileupload" >Remove</a>
        </div>
    </div>
</div>

HtmlInputFileページには、ページへのコントロールが含まれているはずです。このような：

protected HtmlInputFile myFile;

次に、ファイルを受信できるはずです。

if (IsPostBack)
{
    if (myFile.PostedFile != null)
    {
        // File was sent
        var postedFile = myFile.PostedFile;
        int dataLength = postedFile.ContentLength;
        byte[] myData = new byte[dataLength];
        postedFile.InputStream.Read(myData, 0, dataLength);
    }
    else
    {
        // No file was sent

    }
}
于 2012-08-27T03:52:48.207 に答える