Untitled

a guest

Jul 23rd, 2014

440

Never

Add comment

Not a member of Pastebin yet? Sign Up, it unlocks many cool features!

text 2.12 KB | None | 0 0

raw download clone embed print report

Server side MVC4
[HttpPost]
public ActionResult NewIssue(Issue model, List<HttpPostedFileBase> files)
{}
.cshtml
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script>
var selDiv = "";
var storedFiles = [];
$(document).ready(function() {
$("#files").on("change", handleFileSelect);
selDiv = $("#selectedFiles");
$("#myForm").on("submit", handleForm);
$("body").on("click", ".selFile", removeFile);
});
function handleFileSelect(e) {
var files = e.target.files;
var filesArr = Array.prototype.slice.call(files);
filesArr.forEach(function(f) {
if(!f.type.match("image.*")) {
return;
}
storedFiles.push(f);
var reader = new FileReader();
reader.onload = function (e) {
var html = "<div><img src=\"" + e.target.result + "\" data-file='"+f.name+"' class='selFile' title='Click to remove'>" + f.name + "<br clear=\"left\"/></div>";
selDiv.append(html);
}
reader.readAsDataURL(f);
});
}
function handleForm(e) {
e.preventDefault();
var data = new FormData();
for(var i=0, len=storedFiles.length; i<len; i++) {
data.append('files', storedFiles[i]);
}
var xhr = new XMLHttpRequest();
xhr.open('POST', 'NewIssue', true);
xhr.onload = function(e) {
if(this.status == 200) {
console.log(e.currentTarget.responseText);
alert(e.currentTarget.responseText + ' items uploaded.');
}
}
xhr.send(data);
}
function removeFile(e) {
var file = $(this).data("file");
for(var i=0;i<storedFiles.length;i++) {
if(storedFiles[i].name === file) {
storedFiles.splice(i,1);
break;
}
}
$(this).parent().remove();
}
</script>
@using (Html.BeginForm((string)action, "Home", FormMethod.Post, new { enctype = "multipart/form-data", id = "myForm" }))
{
<div>
<input type="file" id="files" name="files" multiple><br/>
<div id="selectedFiles"></div>
</div>
<div class="col-lg-6">
<button class="btn btn-primary" id="btnAddIssue" type="submit">Submit</button>
</div>
}

Add Comment

Please, Sign In to add comment