2013-09-22 2 views
0

Я создал страницу индексаЧтение изображения из DIV в контроллере

<body> 
    <div> 
     <script src="~/Scripts/jquery-1.7.1.js"></script> 
    <style> 
    .thumb { 
    height: 75px; 
    border: 1px solid #000; 
    margin: 10px 5px 0 0; 
    } 
</style> 
@using (Html.BeginForm()) 
{ 
<input type="file" id="files" name="files[]" multiple /> 
<output id="list"></output> 

    <input type="submit" name="Post" /> 
} 
<script> 
    function handleFileSelect(evt) { 
     var files = evt.target.files; // FileList object 

     // Loop through the FileList and render image files as thumbnails. 
     for (var i = 0, f; f = files[i]; i++) { 

      // Only process image files. 
      if (!f.type.match('image.*')) { 
       continue; 
      } 

      var reader = new FileReader(); 

      // Closure to capture the file information. 
      reader.onload = (function (theFile) { 
       return function (e) { 
        // Render thumbnail. 
        var span = document.createElement('span'); 
        span.innerHTML = ['<img class="thumb" src="', e.target.result, 
             '" title="', escape(theFile.name), '"/>'].join(''); 
        document.getElementById('list').insertBefore(span, null); 
       }; 
      })(f); 

      // Read in the image file as a data URL. 
      reader.readAsDataURL(f); 
     } 
    } 

    document.getElementById('files').addEventListener('change', handleFileSelect, false); 
</script> 
    </div> 
</body> 

контроллер

[HttpPost] 
     [ActionName("Index")] 
     public ActionResult Index_Post(FormCollection collection) 
     { 
      var tlist = collection["list"]; 
      return View(); 
     } 

Когда изображения будут загружены, это то, как он выглядит в хроме

enter image description here

, но с источником просмотра Я получаю ниже отображаемый результат

<form action="/imgUpload" method="post"><input type="file" id="files" name="files[]" multiple /> 

Как я могу читать все изображения из этого DIV и сохранить их на диск?

EDIT

Пример сценария: http://www.html5rocks.com/en/tutorials/file/dndfiles/

же вопрос я могу увидеть там

ответ

0

первое изменение формы помощник

@using (Html.BeginForm("Action", 
         "Controller", FormMethod.Post, 
         new { enctype = "multipart/form-data" })) 

затем в контроллере вы можете получить доступ ко всем отвечал файлы с Request.Files или вы можете изменить аргументы контроллера

+0

Это не сработало. Я думаю, причина в том, что ничего не хранится внутри тега . – Zerotoinfinity

+0

Я пробовал с var tlist = Request.Files ["list"]; не повезло – Zerotoinfinity

+0

"list"?! вам нужно изменить его на имя элемента upload в html или просто использовать индекс или с AllKeys получить все ключи и запустить цикл foreach или что-то вроде этого –

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