I am using this code with the help of one tutorial, but still i am unable to upload the image, i mean the image is not appearing, please someone help me on this
This is the code I have used:-
<div class="col-md-6">
<div class="form-group">
#Html.LabelFor(model => model.ImgPath, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<img src="#Url.Content(Model.ImgPath)" style="margin:10px" height="200" width="200" id="imagePreview" />
<input type="file" name="ImageUpload" accept="image/jpeg, image/png" onchange="ShowImagePreview(this, document.getElementById('imagePreview')" />
</div>
</div>
</div>
If your image is not uploading, i think you should check you form tag and make it something like this
<form method="post" enctype="multipart/form-data">
//your image upload
<input type="file" name="ImageUpload" accept="image/jpeg, image/png" />
</form>
then you can use the
Request.Files
and access all the files sent or if you want it strongly embedded use
//this for Asp.Net Core
public IActionResult(IFormFile ImageUpload)
{
//Everything here
}
//Or this for Asp.Net
public ActionResult(HttpPostedFileBase ImageUpload)
{
//Everything else here
}
Read this stackoverflow post to understand about it
Related
I have searched for hours for this without finding an answer, so I'm asking your help (I'm a beginner in web development (and in Asp.Net MVC)).
I want to create a simple data permutator (for example you enter 3 datas "a, b, and c", and I give you the possible permutations between these 3 datas : "abc; acb; bac; bca; cab; cba").
I have tried the following code, but it does not work (I have an HTTP 404 error).
<form method="post">
<div class="col-md-4 input-group">
<div class="input-group-addon">1</div>
<input type="text" name="firstData" class="form-control" placeholder="First Data" maxlength="50" required />
</div>
<div class="col-md-4 input-group">
<div class="input-group-addon">2</div>
<input type="text" name="secondData" class="form-control" placeholder="Second Data" maxlength="50" required />
</div>
<div class="col-md-4 input-group">
<div class="input-group-addon">3</div>
<input type="text" name="thirdData" class="form-control" placeholder="Third Data" maxlength="50" required />
</div>
<div class="col-md-12 mainAction centerbloc">
<input type="submit" value="Permutate the data" class="btn btn-success register-button-slider" href="">
</div>
</form>
And then below, I want to display the result in the same page, like this :
#{ if (IsPost)
{
string firstdata = Request.Form["firstData"];
string seconddata = Request.Form["secondData"];
string thirddata = Request.Form["thirdData"];
<p>
#firstdata #seconddata #thirddata<br />
#seconddata #firstdata #thirddata<br />
</p>
}
}
I haven't put anything special in my controller (maybe the mistake is here?) :
namespace Blogs.Controllers
{
public class ToolsController : Controller
{
[Route("tools/datapermutator", Name = "DataPermutator"), HttpGet]
public ActionResult DataPermutator()
{
return View();
}
}
}
If you have a way to do it, it would be very helpful, thank you in advance!
I want to give user the option to change their profile picture.On hitting the save button my controller action is hit but I get null value for HttpPostedFileBase.I am uploading files first time in mvc so not able to figure out where I am doing wrong and hence getting null value in controller.
controller
[AuthenticationRequired]
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult ChangeProfilePicture(HttpPostedFileBase imageData)
{
}
view
#using (Ajax.BeginForm("ChangeProfilePicture", "Account", new { enctype = "multipart/form-data" },new AjaxOptions { OnSuccess = "OnSuccess" }))
{
#Html.AntiForgeryToken()
<div class="modal-body" id="tilesDescription">
<div class="row">
<div class="col-md-12">
<div class="text-center">
<div class="fileUpload btn btn-primary">
<span>Select a photo from your computer</span>
<input id="uploadBtn" type="file" class="upload" name="imageData" accept="image/*" />
</div>
<div class="text-center">
<img id="imgprvw" alt="uploaded image preview" class="imgPreview hide" />
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-rounded btn-sm btn-tiles" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-rounded btn-sm btn-tiles disabled" id="btnProfilePic">Set as profile picture</button>
</div>
}
You cannot post your file using ajax like that, cause is not supported.
From my experience, the easiest way to get files posted using Ajax (if using jquery), is using :
http://malsup.com/jquery/form/
This is My Index method by which I am getting the list of data in webgird.How can I write a method for exporting this list of data when I click on button?
public ActionResult Index(string eMailId)
{
var refEntry = _moneyReport.GetAll().Where(a => a.EmailId == eMailId).ToList();
var credittotal = _moneyReport.GetAll().Where(a => a.EmailId == eMailId && a.PromoValue < 0).Sum(a => a.PromoValue);
decimal TotalCredit = Convert.ToDecimal(credittotal * -1);
var debittotal = _moneyReport.GetAll().Where(a => a.EmailId == eMailId && a.PromoValue >0).Sum(a => a.PromoValue);
decimal TotalDebit = Convert.ToDecimal(debittotal);
ViewBag.TotDebit = TotalDebit;
ViewBag.TotCredit = TotalCredit;
if(TotalCredit>TotalDebit)
{
decimal FinalTotal = TotalCredit - TotalDebit;
ViewBag.Total = FinalTotal;
}
else
{
decimal FinalTotal = TotalDebit - TotalCredit;
ViewBag.Total = FinalTotal;
}
return View(refEntry);
}
This is my View page where I am entering an emailid,load and Export button`enter code here.
#using (Html.BeginForm())
{
<div class="container-fluid form-row">
<div class="col-md-12 no-padding">
<div class="col-md-3 no-padding">
<input type="text" name="eMailId" id="eMailId" />
<span class="highlight"></span>
<span class="bar"></span>
<label class="no-left">Enter Email Id <sup class="star">*</sup></label>
</div>
<div class="col-md-3">
<input type="text" id="gName" name="gName" readonly="readonly" />
<span class="highlight"></span>
<span class="bar"></span>
<label>Name</label>
</div>
<div class="col-md-3">
<input type="submit" id="btnLoad" class="btn btn-md pm-create" value="Load" />
<input type="submit" id="btnLoad" class="btn btn-md" value="Export To PDF" />
</div>
<input type="hidden" id="HdnEmail" value='#TempData["MailID"]' />
</div>
</div>
}
<div id="report-grid">
#{Html.RenderPartial("ImportMoneyReport", Model);}
</div>
ImPortMoneyReport is my partial page where i ve the webgrid.
To export model data to PDF you will have to use one of third party pdf export libraries such as few below. You will find sample examples on respective sites or google them. You will need to implement code to export pdf in and add that file/stream into Response.OutputStream by setting respective content type in ImportMoneyReport action. Also you will have to invoke ImportMoneyReport method on post/event you can not use Html.RenderPartial to export; otherwise you can put export code in Index action only.
PDF Sharp
iTextSharp
It you want something that's working and very easy to use. Take a look at https://github.com/andyhutch77/MvcRazorToPdf
Just read the documentation.
For sample code. Take a look at this.
https://github.com/andyhutch77/MvcRazorToPdf/tree/master/MvcRazorToPdfExample
If you encounter some issues go to their github page and click the Issues tab, maybe some of your questions are already resolved there.
P.S.
Some of the PDF libraries like Rotativa will require an executable program to run that will not work when your app is deployed to Azure because Azure doesn't support exe files (I guess for security purposes) else you'll create a webjob just for the exe file.
I am using SmartAdmin for UI purpose and MVC4 for coding. SmartAdmin CSS is not supported inside
#using (Html.BeginForm()) {
#Html.ValidationSummary(true)
<fieldset>
<div class="row">
<section class="label col col-1">
#Html.LabelFor(model => model.Name, new { #style = "text-align:left" })
< /section>
<section class="col col-4">
<label class="input"> <i class="icon-append fa fa-user"></i>
#Html.TextBoxFor(model => model.Name, null, new { #placeholder = "Enter Name" })
#Html.ValidationMessageFor(model => model.Name)
</label>
</section>
<section class="label col col-1">
#Html.LabelFor(model => model.Role)
</section>
<section class="col col-4">
<label class="input"> <i class="icon-append fa fa-user"></i>
#Html.TextBoxFor(model => model.Role, null, new { #placeholder = "Enter Role" })
#Html.ValidationMessageFor(model => model.Role)
</label>
</section>
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
But by using code above, UI does not looks in proper format. When I remove
#using (Html.BeginForm()) {
#Html.ValidationSummary(true)
from code then UI looks properly but does not posts values to controller.Now my issue is that, can MVC4 supports SmartAdmin for UI purpose?
Is there any solution for that?
Here is a great tutorial for that:
http://myorange.ca/supportforum/question/how-to-integrate-smartadmin-1-4-x-into-asp-net-mvc-5
add the "smart-form" tag into the class field like below to activate it.
Html.BeginForm("ACTIONNAME", "CONTROLLERNAME", FormMethod.Post, new { #class = "smart-form ", id = "myID" }))
But if you are starting with smartadmin and MVC, i highly recommand you to follow the tutorial:
http://myorange.ca/supportforum/question/how-to-integrate-smartadmin-1-4-x-into-asp-net-mvc-5
I use a bootstrap based template. It works very well for me, in my code I do not use the form helper, so more along the lines of . Try doing this instead to see if that helps. It is entirely possible that the helper is allocating a class to the form which throws out the CSS formatting. Using something like Firebug to look at the effective CSS will help you.
Enviroment: Visual Studio 2012, MVC4, Razor.
My code:
#using (Html.BeginForm())
{
#Html.ValidationSummary(false)
<fieldset>
<div class="editor-field">
#Html.EditorFor(model => model.Name)
#Html.ValidationMessageFor(model => model.Name)
</div>
<p><input name="action:FirstResult" type="submit" value="ResultOne" /></p>
<p><input name="action:SecondResult" type="submit" value="ResultTwo" /></p>
</fieldset>
}
The problem is - I have two Submit Buttons. And they are sending the information to the different views. And I want that views in new windows.
I've tried to insert "new{target = "_blank"}" inside the "#using (Html.BeginForm())", and it is doesn't work.
Please replace your code as follows to solve your problem
#using (Html.BeginForm("FirstAction","Controller"))
{
<input type="submit" value="ResultOne" />
}
#using (Html.BeginForm("SecondAction","Controller"))
{
<input type="submit" value="ResultTwo" />
}
Regards,
Pavan.G