I'm trying to use IBM Watson visual recognition in a web application. I want to send the path of the photo uploaded by the client to a function or a controller so I can use it to build and get a result from visual recognition(build an object).
I managed to get the path like this(in internet explorer):
var input = document.getElementById("file");
var filepath1 = input.value;
I want to know how can i send the path to a controller or to a function in c#.
I also tried to build a form and add an action to the controller but the controller name didn't show up.
<form action="" method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input accept="image/*" title="Choose an image to upload" type="file" name="file" id="file" />
<input type="submit" />
</form>
ViewModel
public class MyViewModel
{
[Display(Name = "My File")]
public IFormFile File { get; set; }
}
View
#model MyViewModel
<form asp-action="Send" enctype="multipart/form-data">
<label asp-for="File">Filename:</label>
<input accept="image/*" title="Choose an image to upload" type="file" asp-for="File" />
<input type="submit" />
</form>
Controller
[HttpPost]
public async Task<IActionResult> Send([Bind("File")] MyViewModel myVM)
{
if (myVM.File?.Length > 0)
{
byte[] fileBytes;
using (var fileStream = myVM.File.OpenReadStream())
using (var ms = new MemoryStream())
{
fileStream.CopyTo(ms);
fileBytes = ms.ToArray();
}
var fileName = Path.GetFileName(myVM.File.FileName);
var fileMimeType = myVM.File.ContentType;
var fileContent = fileBytes;
//You have all the file attributes and content
}
}
Related
I can upload file on my local machine successfully but when i try to upload on host it can't find the action. I don't know why. Here's my code.
HTML
<form method="post" asp-action="UploadFile" asp-controller="Admin" enctype="multipart/form-data">
<div class="custom-file">
<input type="file" class="custom-file-input" id="file" name="file">
<label class="custom-file-label" for="file">Browse</label>
</div>
<button class="btn btn-brand" type="submit">Upload</button>
</form>
C#
public IActionResult UploadFile([FromForm]IFormFile file)
{
var path = Path.Combine(_environment.WebRootPath, "uploads");
if (file!= null && file.Length > 0)
{
using (var reader = new FileStream(Path.Combine(path, "gallery", file.FileName), FileMode.Create))
{
file.CopyTo(reader);
}
Gallery gallery = new Gallery
{
Path = file.FileName
};
db.Gallery.Add(gallery);
db.SaveChanges();
}
return RedirectToAction("Gallery");
}
I'm trying to upload single .txt file, and read it's contents. I'm using IFormFile to do that. My controller is basically like
public IHttpActionResult PostCellInfo(IFormFile file)
{
using (var reader = new StreamReader(file.OpenReadStream()))
{
var fileContent = reader.ReadToEnd();
}
}
and my form in index is
<form name="upload" method="post" enctype="multipart/form-data" action="api/CellInfoes">
<div>
<input name="file" type="file" />
<input type="submit" value="upload" />
</div>
</form>
But error still says
"ExceptionMessage":"Object reference not set to an instance of an
object."
I think "file" is always null. Any ideas why?
I've read that the names must match - but I think this is OK in my code.
The parameter should be IList<IFormFile> files.
public IHttpActionResult PostCellInfo(IList<IFormFile> files)
{
foreach (var file in files) {
if (file.Length > 0) {
using (var reader = new StreamReader(file.OpenReadStream()))
{
var fileContent = reader.ReadToEnd();
}
}
}
}
And change the name attribute in the view also:
<form name="upload" method="post" enctype="multipart/form-data" action="api/CellInfoes">
<div>
<input name="files" type="file" />
<input type="submit" value="upload" />
</div>
</form>
I haven't tested this but it should point you in the right direction.
If you want to use IFormFile without the collection you should check this post.
[HttpPost]
public ActionResult Upload(HttpPostedFileBase file)
{
try
{
var _Img = new ImageBusiness();
var imge = new ImgView { FileName = file.FileName, FileType = file.ContentType };
imge.FileData = new byte[file.ContentLength];
file.InputStream.Read(imge.FileData, 0, file.ContentLength);
_Img.AddImge(imge);
ViewBag.Result = true;
return View ();
}
catch(Exception)
{
ModelState.AddModelError("","An error accured while uploading Image, please try again.");
return View();
}
}
this my view
#using (Html.BeginForm("Upload", "Image", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
#Html.ValidationSummary();
<input name="file" /><br />
<input type="submit" class="btn btn-small" value="Save Brochure" />
}
theres no bugs just on run time when uploading of an image doesnt give me broswer option to select a picture.help will be appreciated thanks
hello i think maybe you missing type file on your input
try something like
<input type="file" name="file" /><br />
<input type="submit" class="btn btn-small" value="Save Brochure" />
I want to upload image to the server, The below code is working properly when i run the the code locally on my system, but when i upload it to the server it gives error message - The model item passed into the dictionary is of type 'Login.Models.User', but this dictionary requires a model item of type 'System.Collection.Generic.IEnumerable'[Login.Models.User]'.Please help to solve this issue.
public ActionResult FileUpload(HttpPostedFileBase file, Login.Models.User model)
{
if(ModelState.IsValid)
{
try
{
var user=db.User.FirstOrDefault(c=>c.Userid==model.Userid);
if (file != null)
{
string pic = System.IO.Path.GetFileName(file.FileName);
string path = System.IO.Path.Combine(Server.MapPath("~/images/profile/"), pic);
file.SaveAs(path);
user.imagepath = "http://sampleApp.com/images/profile/" + pic;
}
Catch(Exception ex)
{
ModelState.AddModelError("",ex.Message);
}
return View("ViewAdmin",model);
}
db.ObjectStateManager.ChangeObjectState(user,System.Data.EntityState.Modified);
db.SaveChanges();
return RedirectToAction("User");
}
View
#model Login.Models.User
#using (Html.BeginForm("FileUpload", "Home", FormMethod.Post, new { enctype = "multipart/form-data"}))
{
<label for="file">Upload Image:</label>
<input type="file" name="file" id="file" style="width: 100%;" />
<input type="submit" value="Upload" class="submit" />
}
Actually I want to send the image and the text in the textbox to the controller...
#using (Html.BeginForm("Upload", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
#Html.Label("UserName:") <input type="text" id="txtImg" name="txtImg" /><br /><br />
#Html.Label("Upload:")<input type="file" name="image" /><br/>
<div id="Preview">
Preview
</div>
<input class="btn btn-success btnUpload" type="submit" value="upload" />
}
and I am trying to retrieve them in the controller in the below way:
public ActionResult Upload(HttpPostedFileBase image,string txtImg)
but I am not getting the textbox value..Is anything wrong withe code?
I have my sample code like this.
Controller:
public ActionResult Upload()
{
BlobStorageServices _blobstorageservice = new BlobStorageServices();
CloudBlobContainer container = _blobstorageservice.GetCloudBlobContainer();
List<string> blobs = new List<string>();
//List<BlobModel> models = BlobManager.getBlobs();
foreach (var blobItem in container.ListBlobs())
{
blobs.Add(blobItem.Uri.ToString());
}
return View(blobs);
}
[HttpPost]
public ActionResult Upload(string txtImg,HttpPostedFileBase image)
{
if (image.ContentLength > 0)
{
BlobStorageServices _blobstorageservice = new BlobStorageServices();
CloudBlobContainer container = _blobstorageservice.GetCloudBlobContainer();
CloudBlockBlob blob = container.GetBlockBlobReference(image.FileName);
//BlobManager.insertBlobUri(new BlobImage { Uri = blob.Uri.ToString() });
// string text = model.Name;
BlobManager.insertBlobUri(new BlobModel {Name=txtImg,Uri=blob.Uri.ToString()});
blob.UploadFromStream(image.InputStream);
}
return RedirectToAction("Upload");
}
View
#using (Html.BeginForm("Upload", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
#Html.Label("UserName:") <input type="text" id="txtImg" name="txtImg" /><br /><br />
#Html.Label("Upload:")<input type="file" name="image" id="upload"/><br/>
<div id="Preview">
Preview<img id="blah" src="#" alt="your image" />
</div>
<input class="btn btn-success btnUpload" type="submit" value="upload" />
}
<table style="border:1">
#foreach (var item in Model)
{
<tr style="border:1">
<td><img src="#item" alt="image" class="img-responsive" width="100" height="100" /></td>
<td><button class="btn btn-primary Delete" id="#item" onclick="deleteImage('#item');">Delete</button></td>
<td><a class="btn btn-primary Download" href="#item" target="_blank">Download Image</a></td>
<td><button class="btn btn-primary Download" onclick="updateImage('#item');">UpdateImage</button></td>
</tr>
}
I am sending the blobs directly into the view , that is the problem basically..How to use a model to insert text,bloburl,image?
Visit Uploading/Displaying Images in MVC 4
This helped me alot for uploading images
In Terms of retrieving data from the View to controller a better way is to use a ViewModel like
public class ExampleViewModel
{
public string Image {get; set;}
public string Text {get; set;}
}
and your view would look something like
#model YourProject.Models.ExampleViewModel
#using (Html.BeginForm("ExampleController","Home",FormMethod.Post, new { enctype = "multipart/form-data" }))
{
#Html.TextBoxFor(model => model.Text)
<input id="Image" type="file" name="Image" data-val="true" />
}
and the controller
public ActionResult ExampleController(ExampleViewModel model)
{
//Not sure how you wanted to get the image so I just put this in here
foreach (string file in Request.Files)
{
HttpPostedFileBase hpf=Request.Files[file] as HttpPostedFileBase;
if(hpf.ContentLengh==0)
continue;
string folderPath = Server.MapPath("~/yourFolderPath");
Directory.CreateDirectory(folderPath);
string savedFileName = Server.MapPath("~/yourFolderPath/" + hpf.FileName);
hpf.SaveAs(savedFileName);
model.Image="~/yourFolderPath/" + hpf.FileName;
}
//this variable is getting the text from the ViewModel
string text=model.Text;
}
Hope this helps :)