Загрузка файлов с использованием jQuery drag & drop в ASP.NET MVC4

Question

У меня мало (почти нет) опыта работы с AJAX.

Я хочу создать образец формы, где я могу загружать файлы изображений (подумайте об аукционах на eBay), но эти файлы можно (и должно) перетащить &, которые попадают в окно браузера, например, при загрузке APK в Google Play.

Я никогда не делал такого, и я хочу учиться. I в настоящее время не имеют реального использования для реализации, я прошу об этом узнать. Итак, давайте рассмотрим пример eBay.

Мои ViewModel может выглядеть следующим образом:

public class AuctionViewModel { 

    public string Title, Description; 
    public double Price; 
    [...] 
    public IEnumerable<Picture> Images; //most important part! 
} 

public class Picture { 
    public string Url; //display URL, perhaps to be generated 
    public byte[] payload; //uploaded data 
} 

Очки вопроса:

1. Как контроллер выглядит? Я думаю, мне нужен отдельный контроллер для загрузки AJAX (предполагается, что ViewModel хранится в сеансе)
2. Как выглядит клиентский код Javascript?
3. Есть ли какой-либо учебник о draggable & droppable files in jQuery/AJAX/MVC4?

Answer 1

Вы можете использовать HTML5 File API. Это позволит вам подписаться на событие drop элемента DOM и иметь возможность извлекать содержимое файла и использовать объект XmlHTTPRequest для асинхронной отправки файла на сервер. Ссылка Mozilla, которую я опубликовал, содержит обширные примеры.

На стороне сервера вы можете использовать IEnumerable<HttpPostedFileBase> для загрузки загруженных файлов вместо byte[]. Если вы используете тип содержимого multipart/form-data с запросом AJAX, как показано в примерах, связующее устройство по умолчанию автоматически привяжет загруженные файлы к модели.