Изображение с ASP.NET MVC и управления диалог

Question

развитие конца будучи фоновым для нескольких проектов Теперь я developping веб-приложения в ASP.Net MVC 3

У меня есть форма, которая содержит несколько полей и возможность загрузить изображение, которое отлично работает

Я хочу, чтобы теперь у пользователя появилась возможность выбрать изображение из каталога, поэтому я решил использовать диалог после нажатия кнопки и выбора изображения, я смогли показать диалог с некоторыми изображениями, но не смогли найти, как выбрать изображение и привязать его к моей модели просмотра.

Вот код, у меня сейчас

public class PopupController : Controller 
{ 
    public ActionResult Index() 
    { 
     return View(); 
    } 
    public ActionResult ProductPartial() 
    { 
     ViewBag.Images = Directory.EnumerateFiles(Server.MapPath("~/images_upload")) 
          .Select(fn => "~/images_upload/" + Path.GetFileName(fn)); 
     return PartialView("_ProductPartial"); 
    } 
} 

и мнения

<script type="text/javascript" > 
$(function() { 
    $('#dialog').dialog({ 
     autoOpen: false, 
     width: screen.width/2, 
     height:screen.height/2, 
     resizable: false, 
     title: 'Product', 
     modal: true, 
     open: function(event, ui) { 
      $(this).load("@Url.Action("ProductPartial", "Popup")"); 
     }, 
     buttons: { 
      "Close": function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 
    $("#opener").click(function() { 
     $("#dialog").dialog("open"); 
    }); 
}); 

и, наконец, частичный вид

@foreach(var image in (IEnumerable<string>)ViewBag.Images) 
{ 
<img src="@Url.Content(image)" alt="Hejsan" width="100" height="100" /> 
} 

Мой ViewModel содержит это свойство

public HttpPostedFileBase imageVente { get; set; } 

Благодаря

Answer 1

Вы показывает список серверных изображений и позволяет пользователю выбрать один.

Для этого вам не нужен HttpPostFileBase, который позволяет пользователю загружать новое изображение со своего компьютера.

Добавьте имя файла в тег изображения:

@foreach(var image in (IEnumerable<string>)ViewBag.Images) 
{ 
    <img data-name='image' src="@Url.Content(image)" alt="Hejsan" width="100" height="100" class='selectable-image' /> 
} 

добавить скрытое поле в форму

<input type="hidden" name="selectedImage" id="selectedImage" /> 

добавить OnClick к изображениям, чтобы добавить «выбранный» класс и заполнить скрытое поле

$(".selectable-image").click(function() 
{ 
    $(".selectable-image").removeClass("selected"); 
    $(this).addClass("selected"); 
    $("#selectedImage").val($(this).data("name")) 
}); 

в своем действии контроллер/ViewModel, получить имя selectedImage:

public string selectedImage { get; set; } 

---

Edit: Выше от оригинального вопроса, который отображает несколько изображений с сервера. Это позволяет пользователю выбирать изображение и передавать его обратно на сервер.

В дополнительном комментарии разъясняется, что HttpPostFileBase не была ошибкой, и требование также должно позволить загрузку на стороне клиента.

В этом случае, просто добавьте input type='file' в форму с именем соответствия вашего параметра:

<input type='file' name="imageVente"> 

Я не 100% уверен, что вы можете использовать это в качестве модели собственности, но он работает как параметр на действии:

[HttpPost] 
public ActionResult UploadImage(HttpPostedFileBase imageVente) 

Убедитесь, что form также enctype="multipart/form-data" (проверить многочисленные SO вопросы для получения более подробной информации о загрузке файлов).