Had this working; at one stage. The problem is the following text is now appearing in the field for the image in the database "System.Web.HttpPostedFileWrapper"
the following code is from the controller:
[HttpPost]
public ActionResult Create(CarAdvert caradvert,
HttpPostedFileBase picture1)
{
if (ModelState.IsValid)
{
if (picture1 != null)
{
string image1 = picture1.FileName;
caradvert.Image1 = image1;
var image1Path = Path.Combine(Server.MapPath("~/Content/Images"), image1);
picture1.SaveAs(image1Path);
}
db.CarAdverts.Add(caradvert);
db.SaveChanges();
return RedirectToAction("Index");
}
This code is from the create view:
#using (Html.BeginForm("Create", "UserCarAdverts", FormMethod.Post, new { enctype = "multipart/form-data" })) {
#Html.ValidationSummary(true)
<fieldset>
<legend>CarAdvert</legend>
<div class="editor-field">
<input type="file" name="Image1" />
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
the paramater in the controller for HttpPostedFileBase has to have the same name as the input type="file" . Either do:
[HttpPost]
public ActionResult Create(CarAdvert caradvert,
HttpPostedFileBase Image1)
or
<input type="file" name="picture1" />
That should do it
Related
In my ASP.NET MVC3 RAZOR project i have to implement image upload.I have tried different Tutorials and none working fine for me.I have a model ,controller and a view file.
There is as search action ,from the search action the customer List will be loaded with an option to upload Files.
here my question is how to upload an image to sql server using ASP.Net MVC3 Razor
Model Code
namespace Elixir.Models
{
[Table("tbl_ElixiCustPro")]
public class ElixiCustPro
{
[Key]
public int ImageId { get; set; }
public int CusId { get; set; }
public string CustomerName { get; set; }
public string ImageUrl { get; set; }
public byte[] Image { get; set; }
}
}
Controller
[HttpGet]
public ActionResult UploadPhoto()
{
return View();
}
[HttpPost]
public ActionResult UploadPhoto(ElixiCustPro elixi, HttpPostedFileBase uploadfile, int CusId,string Name)
{
if (uploadfile != null && uploadfile.ContentLength > 0)
{
elixi.Image = new byte[uploadfile.ContentLength];
uploadfile.InputStream.Read(elixi.Image, 0, uploadfile.ContentLength);
}
try
{
if (ModelState.IsValid)
{
ecp.Image = new byte[uploadfile.ContentLength];
ecp.ImageUrl = "";
ecp.CustomerName = Name;
ecp.CusId = CusId;
ment.ElixiProData.Add(ecp);
ment.SaveChanges();
return RedirectToAction("Index");
}
}
catch
{
return View();
}
return View();
}
View Code
<legend>File Management</legend>
#using (Html.BeginForm("UploadPhoto", "Home",FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<div class="form-group">
<label class="col-lg-2 control-label">
Customer ID</label>
<div class="col-lg-10">#Html.TextBoxFor(model => model.CusId, new { #class = "form-control" })</div>
<label class="col-lg-2 control-label">
Customer Name</label>
<div class="col-lg-10">#Html.TextBoxFor(model => model.Name, new { #class = "form-control" })</div>
</div>
<input type="hidden" id="id" />
<div class="col-md-6">
<div class="form-group">
<label class="col-lg-2 control-label">
DMIT Image</label>
<div class="col-lg-10">
<input type="file" id="file" name="file">
<input type="submit" class="btn btn-success" value="Upload" />
</div>
</div>
</div>
}
The Ajax form does update selected div, but instead of just reloading a partial view in that div it inserts the whole page content into that div.
.cshtml file
<fieldset>
<legend>File(s)</legend>
<div id="filesBody">
#Html.Action("Action", "Controller", new {id=Model.Id})
</div>
<br />
#using (Ajax.BeginForm("UploadFile", "Controller", null, new AjaxOptions { UpdateTargetId="filesBody"}, new { enctype = "multipart/form-data", #id = "myForm" }))
{
#Html.HiddenFor(model => model.ComplaintId)
<div>
<label for="File">Add File:</label>
<input type="file" name="FileAttachment" />
<input type="submit" value="Upload" />
#Html.ValidationMessage("FileAttachment")
</div>
}
</fieldset>
Controller
public PartialViewResult GetFilesData(long? Id)
{
Model Model = new Model(Id);
TryUpdateModel(Model);
return PartialView(Model);
}
Partial view
#model Models
<div id="reloadField">
#foreach (var ph in Model.docs)
{
///code
}
</div>
In your partial view set the Layout equal to null.
#model Models
#{
Layout = null;
}
UPDATE
Change your Ajax.BeginForm to call the GetFilesData action.
I have to pass hidden filed values to controller action. So I have tried in the following way, but I am getting null values.
I have tried both methods i.e formcollection and viewmodel concept
Controller
public ActionResult MapIcon()
{
Hidden hd = new Hidden();
return View(hd);
}
[HttpPost]
public ActionResult MapIcon(Hidden hidden)
{
var value=hidden.hiddevalue;//null
FormCollection col = new FormCollection();
var value = col["hidden1"];
// string value = mycontroler.ControlName;
return View(hidden);
}
View
#model SVGImageUpload.Models.Hidden
Razor view:#using (Html.BeginForm(new { id = "postform" }))
{
<input type="hidden" id="" value="7" name="hidden1" />
<input type="hidden" id="" value="7" name="hidden2"/>
<input type="submit" value="Match"/>
}
Viewmodel
public class Hidden
{
public string hiddevalue { get; set; }
}
Try this, In Razor view:
#using (Html.BeginForm(new { id = "postform" }))
{
#Html.HiddenFor(m=>m.hiddevalue)
<input type="submit" value="Match"/>
}
It seems to me like you are trying to get multiple values into the POST controller. In that case, and by your exam, the value from the hidden input is enough. In that case, you can setup your controller as so:
public ActionResult Index()
{
Hidden hd = new Hidden();
return View(hd);
}
[HttpPost]
public ActionResult Index(IEnumerable<string> hiddens)
{
foreach (var item in hiddens)
{
//do whatter with item
}
return View(new Hidden());
}
and as for your view, simple change it in order to bind to the same name "hiddens" as so:
#using (Html.BeginForm(new { id = "postform" }))
{
<input type="hidden" value="7" name="hiddens" />
<input type="hidden" value="2" name="hiddens" />
<input type="submit" value="Match" />
}
Hope this serves what you are looking forward to.
if your hidden value is static.Than try this
View
#using (Html.BeginForm(new { id = "postform" }))
{
#Html.HiddenFor(m=>m.hiddevalue)
<input type="hidden" id="" value="7" name="hidden1" />
<input type="hidden" id="" value="7" name="hidden2"/>
<input type="submit" value="Match"/>
}
Controller
[HttpPost]
public ActionResult MapIcon(Hidden hidden, string hidden1, string hidden2)
{
var hiddenvalue = hidden.hiddevalue;
var hiddenvalue1 = hidden1;
var hiddenvalue2 = hidden2;
var value=hidden.hiddevalue;//null
FormCollection col = new FormCollection();
var value = col["hidden1"];
// string value = mycontroler.ControlName;
return View(hidden);
}
Script
$(document).ready(function () {
$('#hiddevalue').val("Jaimin");
});
for some reason, my form post does not work when i have the hidden field in mvc3 razor. It works fine if i remove the hidden field but i need that field.
Below are my ProductsController post method and razor view
#model CCSPurchasing_MVC.Models.AddNewProductModel
#using CCSPurchasing_MVC.Models
#using (Html.BeginForm("editImage", "Products", FormMethod.Post))
{
#Html.ValidationSummary(true)
#Html.HiddenFor(m => m.ImadeId)
<div class="editor-field">
<p style="margin-left: 300px; margin-right: 20px;">
#Html.LabelFor(m => m.ImageFile)
<input type="file" name="file" id="file" data-val="true" data-val-required="Product Image is required"/>
</p>
</div>
<input type="submit" value="Edit" />
}
[HttpPost]
public ActionResult editImage(AddNewProductModel newP, HttpPostedFileBase file)
{
db = new DBConnection();
if (file != null && file.ContentLength > 0)
{
newP.ImageName = Path.GetFileName(file.FileName);
newP.ImageType = file.ContentType;
newP.ImageSize = file.ContentLength;
newP.ImageFile = new byte[file.ContentLength];
file.InputStream.Read(newP.ImageFile, 0, file.ContentLength);
newP.ImageHeight = 200;
newP.ImageWidth = 200;
}
string result = db.editImage(newP);
return View("editImageUpdate");
}
Just make your form tag like this and I am sure it will work for you also as it worked for me when I tested your code:
#using (Html.BeginForm("EditImage", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
}
You need to add enctype = "multipart/form-data" also in your code if you want to submit the file with your fileupload control.
I have code in View:
#using (Html.BeginForm("MyAction", "MyController")
{
<input type="text" id="txt" />
<input type="image" src="/button_save.gif" alt="" />
}
How can I pass value of txt to my controller:
[HttpPost]
public ActionResult MyAction(string text)
{
//TODO something with text and return value...
}
Give your input a name and make sure it matches the action's parameter.
<input type="text" id="txt" name="txt" />
[HttpPost]
public ActionResult MyAction(string txt)
Add an input button inside of your form so you can submit it
<input type=submit />
In your controller you have three basic ways of getting this data
1. Get it as a parameter with the same name of your control
public ActionResult Index(string text)
{
}
OR
public ActionResult Index(FormsCollection collection)
{
//name your inputs something other than text of course : )
var value = collection["text"]
}
OR
public ActionResult Index(SomeModel model)
{
var yourTextVar = model.FormValue; //assuming your textbox was inappropriately named FormValue
}
I modified Microsoft MVC study "Movie" app by adding this code:
#*Index.cshtml*#
#using (Html.BeginForm("AddSingleMovie", "Movies"))
{
<br />
<span>please input name of the movie for quick adding: </span>
<input type="text" id="txt" name="Title" />
<input type="submit" />
}
//MoviesController.cs
[HttpPost]
public ActionResult AddSingleMovie(string Title)
{
var movie = new Movie();
movie.Title = Title;
movie.ReleaseDate = DateTime.Today;
movie.Genre = "unknown";
movie.Price = 3;
movie.Rating = "PG";
if (ModelState.IsValid)
{
db.Movies.Add(movie);
db.SaveChanges();
return RedirectToAction("Index");
}
else
{
return RedirectToAction("Index");
}
}