2013-07-02 2 views
0

В проекте ASP.NET MVC я загружаю файлы изображений на веб-сервер с помощью плагина FineUploader jQuery. Часть загрузки файлов работает нормально, но теперь мне нужно сохранить имена загруженных изображений в базу данных с соответствующими данными модели (сведения о продукте с именами изображений продукта).Как обновить клиентскую модель MVC с помощью Javascript?

Модели:

public class Product 
{ 
    [Key] 
    [DatabaseGeneratedAttribute(DatabaseGeneratedOption.Identity)] 
    public int Id { get; set; } 
    public string Name { get; set; } 
    ... 
    public virtual IEnumerable<ProductImage> Images { get; set; } 
} 

public class ProductImage 
{ 
    [Key] 
    [DatabaseGeneratedAttribute(DatabaseGeneratedOption.Identity)] 
    public int Id { get; set; } 
    public string FileName { get; set; } 
} 

Это мой HTML & код JavaScript, чтобы загрузить файл & дисплей загруженный файл на странице, когда загрузка будет завершена

... 
<div id="fine-uploader"></div> 
<div id="divImgs"> 
    <ul> 
    </ul> 
</div> 
.... 

<script> 
    function createUploader() { 
     var uploader = new qq.FineUploader({ 
      element: document.getElementById('fine-uploader'), 
      debug: true, 
      request: { 
       endpoint: '@Url.Action("UploadFile", "Upload")' 
      }, 
      validation: { 
       allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'] 
      }, 
      deleteFile: { 
       enabled: true, 
       forceConfirm: true, 
       endpoint: '@Url.Action("DeleteFile", "Upload")' 
      }, 
      callbacks: { 
       onComplete: function (id, fileName, responseJSON) { 
        if (responseJSON.success) { 
         $('#divImgs ul').append(
          $('<li>').append(
           $('<img>').click(
            function DeleteFileCall() { 
             $.ajax({ 
              type: "POST", 
              url: '@Url.Action("DeleteFile", "Upload")' + '/' + fileName, 
              contentType: "application/json; charset=utf-8", 
              dataType: "html" 
             }); 
             $(this).parent().remove(); 
          }).attr('src', responseJSON.uploadedFilePath)) 
         ); 
        } 
       } 
      } 
     }); 


     } 

     window.onload = createUploader; 
</script> 

Как я могу добавить загруженный файл имена для модели с javascript & обновляют базу данных только тогда, когда пользователь сохраняет данные модели.

+0

Это не кажется, вопрос Fine Uploader как вы спрашиваете именно о стороне сервера код, который на самом деле не привлекать библиотеку. Кроме того, вы должны использовать плагин Fine Uploader jQuery, и я не уверен, почему у вас включена функция удаления файлов и отправляет ваши собственные запросы ajax для файлов delete. –

+0

@RayNicholus Да, я просто удалил тэг [FineUploader] .. также со второй точкой, вы правы. На самом деле я попробовал функцию 'deleteFile' в' FineUploader', но позже понял, что мне нужен собственный метод удаления для удаления ранее добавленных изображений (когда редактирование существующего продукта), но забыл удалить метод deleteFile FineUploader ... :( – Nalaka526

+1

Я также предлагаю использовать плагин jQuery Fine Uploader, так как вы уже используете jQuery. –

ответ

0

Если вы загружаете тело Stream в свой контроллер, вы можете передать имя файла в качестве параметра строки запроса и сопоставить его с параметром функции для сохранения позже.

пример из другого проекта

[WebInvoke(UriTemplate = "/AddImage/{filename}", Method="POST")] 
public PrimitiveResponse AddImage(string filename, Stream imageData) 
{ 
    //magic happens here 
} 
+0

В этом случае будет указано имя файла в заголовке многострочной границы. Файл отправляется через многостраничный запрос POST. –

Смежные вопросы