編集依頼に対してちゃんと質問に追記されたので、可能な限りお手伝いしたいと思います。
まずそもそも諸々をサーバサイドでやるか、クライアントサイドでやるか、あるいは組み合わせるかを考える必要があります。
やりたいことを一つ一つ分けて解決しましょう。
1. ASP.NET WebFormにより画像アップロードの機構を作りたい
2. アップロードする画像のサイズを制限したい
3. アップロードされた画像を指定のディレクトリに保存したい
4. アップロードされた画像はサムネ表示したい
5. サムネ表示されている画像を削除したい
1については、ASP.NETの標準機構であれば割りと簡単です。
https://www.ipentec.com/document/document.aspx?page=csharp-aspnet-uploader-control
2については、クライアント(JavaScript)でやるかサーバ(C#)でやるか決める必要があります。
たぶんここがごっちゃになってますよね。
3については、簡単で1のURLで例示したとおりPOSTされたデータから取り出して、任意のフォルダに保存してやればよいかと。
4については、ファイルアップロードの前にやりたいのか、後にやりたいのかによって動きが変わります。
理想に近いとおっしゃったページではjQueryからやってますね。つまりアップロードの前です。
ASP.NETでのみ実現するのであればアップロード後に行なう必要がありそうです。
5については、上記4項目に関連して、ファイルアップロード後に消したいのか、ファイルアップロード前に消したいのかによります。
アップ前であれば、すでに選択してサムネ表示されている画像をjQuery等で消し去る形になります。
アップ後であれば、サーバに保存されている画像を物理削除し、画面上もクリアする形になります。
大前提としてPostBack機構の理解や、JavaScript/jQueryでいかに処理をハンドリングしてPOSTするか、あるいはPOSTされる内容がどのようにサーバサイドに渡るのか、そのあたりの知識はありますか?
無いのであればJavaScript/jQueryを一切使わずにASP.NET WebFormの機構でのみ実現したほうがいいです。
混在して分からなくなってくるので。
これを踏まえて、理想に近いといったページに対して画像ファイルを選択(複数可)と削除、表示された画像のサイズ変更
を実装するのなら、私ならこうします。
- "hogeFile","hogeText"をコピーして「複数」必要な分だけ用意
- "preview_field"を"hogeField"とし、上記複数用意した画像選択コントロール分だけ同様の命名ルールで用意
- 用意したFile/Text/Fieldのセット分だけ「削除用」のコントロールを用意
- 削除用のコントロールにjQueryイベントを連動させ、選択中の画像を解除する処理を実装
- JavaScript関数のpreviewを改修し、サムネイルとして表示したい画像サイズにリサイズして表示
- "hogeSubmit"を"fileUpload"等に変更
- jQueryのsubmitハンドラ内で固定1コントロールだけ指定している部分を任意の数扱えるように修正
- ajax通信の前に選択された画像群のサイズを調べてNGだったらエラー表示するように分岐
これはJavaScript/jQuery側に実装を寄せたパターンです。
愚直に言われたことだけができるプログラムになりますので、プロダクトとして作るならもっと考える必要があります。