I am trying to integrate Report Viewer for MVC to my angular app with ASP.NET MVC 5.
REPORT:
View/Report/Index.cshtml
#model JET.Shop.Common.Models.ReportRequestModel
#using ReportViewerForMvc;
<div>
<div class="row">
<div class="col-md-5">
#using (Html.BeginForm("Index", "Report", FormMethod.Post))
{
<div class="form-group">
<label>Start Date</label>
#Html.TextBoxFor(model => model.StartDate, string.Format("{0:d}", DateTime.Now), new { #id = "startDate", #class = "datefield", type = "date" })
</div>
<div class="form-group">
<label>End Date</label>
#Html.TextBoxFor(model => model.EndDate, string.Format("{0:d}", DateTime.Now), new { #id = "endDate", #class = "datefield", type = "date" })
</div>
}
</div>
<div class="col-md-7">
<div class="form-group">
<input type="submit" value="Generate" />
</div>
</div>
</div>
<div class="row">
#Html.ReportViewer(ViewBag.ReportViewer as Microsoft.Reporting.WebForms.ReportViewer)
</div>
</div>
ReportController
public class ReportController : Controller
{
// GET: Report
public ActionResult Index(ReportType reportType = ReportType.SalesOrderList)
{
ReportRequestModel model = new ReportRequestModel();
model.Type = reportType;
model.StartDate = DateTime.Now;
model.EndDate = DateTime.Now;
return PartialView(model);
}
[HttpPost]
public ActionResult Index(ReportRequestModel request)
{
List<ReportParameter> reportParams = new List<ReportParameter>();
ReportViewer reportViewer = new ReportViewer();
reportViewer.ProcessingMode = ProcessingMode.Local;
SalesOrdersListDataSet salesOrderDataSet = new SalesOrdersListDataSet();
salesOrderDataSet.SalesOrder.AddSalesOrderRow(Guid.NewGuid(), DateTime.Now, DateTime.Now, DateTime.Now.AddDays(1), 500, 60, 440, "Complete");
salesOrderDataSet.SalesOrder.AddSalesOrderRow(Guid.NewGuid(), DateTime.Now, DateTime.Now, DateTime.Now.AddDays(1), 100, 12, 88, "Complete");
ReportDataSource reportDataSource1 = new ReportDataSource();
reportDataSource1.Name = "Report"; //Name of the report dataset in our .RDLC file
reportDataSource1.Value = salesOrderDataSet.SalesOrder;
reportViewer.LocalReport.DataSources.Add(reportDataSource1);
reportViewer.LocalReport.ReportEmbeddedResource = "JET.Shop.WebApp.Reports.SalesOrderListReport.rdlc";
reportViewer.LocalReport.SetParameters(reportParams);
ViewBag.ReportViewer = reportViewer;
return PartialView(request);
}
}
RouteConfig
routes.MapRoute(
name: "ReportController",
url: "Report/Index/{reportType}",
defaults: new { controller = "Report", action = "Index", reportType = UrlParameter.Optional }
);
$RouteProvider
.when("/Report", {
templateUrl: "/Report/Index",
controller: "ReportController",
loginRequired: true,
requiredRoles: ["Admin"]
})
I basically wanna try to render this report viewer but I got stuck with getting HTTP 500 - Internal Server Error on the console.
I did some random trial and error and found out that if I make my Report/Index.cshtml contain nothing but plain HTML (no razor) it renders. But when I include my #model statement on the view I get HTTP 500. Can anyone help me with this issue? Breakpoints to my controller (GET Index) works fine.
FYI I navigate to the Report page by accessing it directly via URL on the browser for quick testing only.
Any suggestions on how should I approach this? My main goal is to display a ReportViewer because I can work from there once it gets rendered on the view.
Report/Index.cshtml with plain HTML that works..
#*#model JET.Shop.Common.Models.ReportRequestModel
#using ReportViewerForMvc;*#
<div>
<div class="row">
<div class="col-md-5">
#*#using (Html.BeginForm("Index", "Report", FormMethod.Post))
{
<div class="form-group">
<label>Start Date</label>
#Html.TextBoxFor(model => model.StartDate, string.Format("{0:d}", DateTime.Now), new { #id = "startDate", #class = "datefield", type = "date" })
</div>
<div class="form-group">
<label>End Date</label>
#Html.TextBoxFor(model => model.EndDate, string.Format("{0:d}", DateTime.Now), new { #id = "endDate", #class = "datefield", type = "date" })
</div>
}*#
THIS WORKS FINE!
</div>
<div class="col-md-7">
<div class="form-group">
<input type="submit" value="Generate" />
</div>
</div>
</div>
<div class="row">
#*#Html.ReportViewer(ViewBag.ReportViewer as Microsoft.Reporting.WebForms.ReportViewer)*#
</div>
</div>
Just to close this question,
I ended up not using the report viewer at all. I just created an MVC controller that generates an Excel/PDF from a crystal report.
Related
my model looks like this:
Bank Other LawFirm
| | |
BankContact OtherContact LawFirmContact
|______________|________________|
|
|
Contact
So when creating a contact I am trying to pass the information to create entry for the specific associated entity. At the moment I pass through a RelationId and ContactId and then try and create a the new entity in the controller but my "Save button on the form is not firing. I think it could be because I am not binding the information properly. I'm also posting this to see if this is the correct way to deal with a situation like this
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Save(ContactFormViewModel viewModel)
{
if (!ModelState.IsValid)
{
return View("ContactForm", viewModel);
}
if (viewModel.Contact.Id == 0)
{
_context.Contacts.Add(viewModel.Contact);
if (viewModel.IsBank)
{
var bankContact = new BankContact()
{
BankId = viewModel.RelationId,
Bank = _context.Banks.Single(b => b.Id == viewModel.RelationId),
ContactId = viewModel.ContactId,
Contact = viewModel.Contact
};
_context.BankContacts.Add(bankContact);
}
else if (viewModel.IsLawFirm)
{
var lawFirmContact = new LawFirmContact()
{
LawFirmId = viewModel.RelationId,
LawFirm = _context.LawFirms.Single(l => l.Id == viewModel.RelationId),
ContactId = viewModel.ContactId,
Contact = viewModel.Contact,
};
_context.LawFirmContacts.Add(lawFirmContact);
}
else if (viewModel.IsOther)
{
var standaloneContact = new StandaloneContact()
{
StandAloneId = viewModel.RelationId,
Standalone = _context.Standalones.Single(s => s.Id == viewModel.RelationId),
Contact = viewModel.Contact,
ContactId = viewModel.ContactId
};
_context.StandaloneContacts.Add(standaloneContact);
}
}
else
{
var contactInDb = _context.Contacts.Single(c => c.Id == viewModel.Contact.Id);
contactInDb.Firstname = viewModel.Contact.Firstname;
contactInDb.Surname = viewModel.Contact.Surname;
contactInDb.Email = viewModel.Contact.Email;
contactInDb.ContactNo = viewModel.Contact.ContactNo;
if (!String.IsNullOrWhiteSpace(viewModel.Contact.AltContactNo))
contactInDb.AltContactNo = viewModel.Contact.AltContactNo;
}
_context.SaveChanges();
return RedirectToAction("Index", "Contacts");
}
<div class="card">
<div class="card-body">
#using (Html.BeginForm("Save", "Contacts"))
{
<div class="form-row">
<div class="col-3">
<div class="form-group">
#Html.LabelFor(c => c.Contact.Firstname, new { #class = "form-control-label" })
#Html.TextBoxFor(c => c.Contact.Firstname, new { #class = "form-control" })
#Html.ValidationMessageFor(c => c.Contact.Firstname)
</div>
</div>
<div class="col-3">
<div class="form-group">
#Html.LabelFor(c => c.Contact.Surname, new { #class = "form-control-label" })
#Html.TextBoxFor(c => c.Contact.Surname, new { #class = "form-control" })
#Html.ValidationMessageFor(c => c.Contact.Surname)
</div>
</div>
</div>
<div class="form-row">
<div class="col-3">
<div class="form-group">
#Html.LabelFor(c => c.Contact.Email, new { #class = "form-control-label" })
#Html.TextBoxFor(c => c.Contact.Email, new { #class = "form-control" })
#Html.ValidationMessageFor(c => c.Contact.Email)
</div>
</div>
<div class="col-3">
<div class="form-group">
#Html.LabelFor(c => c.Contact.Birthday, new { #class = "form-control-label" })
#Html.TextBoxFor(c => c.Contact.Birthday, new { #class = "form-control datepicker-here", #data_language = "en", #autocomplete = "off" })
</div>
</div>
</div>
<div class="form-row">
<div class="col-3">
<div class="form-group">
#Html.LabelFor(c => c.Contact.ContactNo, new { #class = "form-control-label" })
#Html.TextBoxFor(c => c.Contact.ContactNo, new { #class = "form-control" })
#Html.ValidationMessageFor(c => c.Contact.ContactNo)
</div>
</div>
<div class="col-3">
<div class="form-group">
#Html.LabelFor(c => c.Contact.AltContactNo, new { #class = "form-control-label" })
#Html.TextBoxFor(c => c.Contact.AltContactNo, new { #class = "form-control" })
</div>
</div>
</div>
<div class="form-row">
<div class="col-4">
<div class="form-group">
<input type="radio" name="choice-contact-type" id="choice-contact-type-bank" required>
<label for="choice-contact-type-bank">Bank</label>
<div class="reveal-if-active">
#Html.DropDownListFor(b => b.BankContact.BankId, new SelectList(Model.Banks, "Id", "Name "), "", new { #class = "form-control" })
#{Model.IsBank = true;}
</div>
</div>
</div>
<div class="col-4">
<div class="form-group">
<input type="radio" name="choice-contact-type" id="choice-contact-type-lawFirm">
<label for="choice-contact-type-lawFirm">Law Firm</label>
<div class="reveal-if-active">
#Html.DropDownListFor(l => l.LawFirmContact.Id, new SelectList(Model.LawFirms, "Id", "Name"), "", new { #class = "form-control" })
#{Model.IsLawFirm = true;}
</div>
</div>
</div>
<div class="col-4">
<div class="form-group">
<input type="radio" name="choice-contact-type" id="choice-contact-type-standalone">
<label for="choice-contact-type-standalone">Other</label>
<div class="reveal-if-active">
#Html.DropDownListFor(s => s.StandaloneContact.Id, new SelectList(Model.Standalones, "Id", "Name"), "", new { #class = "form-control" })
#{Model.IsOther = true;}
</div>
</div>
</div>
</div>
#Html.AntiForgeryToken()
<button type="submit" class="btn btn-primary">Save</button>
}
</div>
</div>
Edit
The hidden dropdown fields are required and therefore validation is not allowing it to go through and because they were hidden I could not see that! The field is required because under my StandaloneContact Id is required. It is always required, so how would I get around this? setting it to a default value?
I'd still like to know if this is the best way to link a model to 3 different models with a many-to-many relationship. Is there another way to do this in MVC?
Try adding this to the form
#using (Html.BeginForm("Save", "Contacts", FormMethod.Post))
Also in regards to the correct way to send data from the view to the controller, it's mostly just what you need at the given time. If you simply want to send data in a form, this is probably the best way. However, if you, for example, what to send this data and then refresh a certain aspect of the page such as a partial view, I would suggest using ajax.
EDIT: Based on the edit to the question, by making the Standalone Contact ID a nullable, this should resolve the issue of the id always being required
I am a beginner and learning ASP.Net MVC web development. I am stuck at one place.
I have a reset password window. If user successfully resets the password I want him to redirect to the same page but I want a "Password Reset Successful" message to be on top. It can be an alert or something. Just user should know that password has been reset. But I don't know how to achieve this. Below is what I have till now.
[HttpPost]
[ValidateAntiForgeryToken]
public ViewResult WidgetResetPassword(ResetPasswordMV data)
{
bool isValid = false;
isValid = ModelState.IsValid;
// verify the 2 password match
if (isValid && !data.NewPassword.Equals(data.ConfirmNewPassword))
{
isValid = false;
ModelState.AddModelError("ConfirmNewPassword", "Passwords doesn't match.");
}
if (isValid)
{
//setting the correct tenant id
if (Session[Constants.SESSION_USER_KEY] != null)
{
UserMV authenticatedUsers = (UserMV)Session[Constants.SESSION_USER_KEY];
data.UserId = authenticatedUsers.Id;
}
ResetPasswordHelper.Save(data);
}
return View(data);
}
My .cshtml file:
#model ResetPasswordMV
#using SIM_Obj.ModelViews;
#{
ViewBag.Title = "Reset Password";
}
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
#* <div id="ResetPasswordWidget" class="form-horizontal">*#
<div id="ResetPasswordWidget" class="form-horizontal-width-inherit">
<h3>Reset Password</h3>
<hr/>
#Html.ValidationSummary(true, "", new {#class = "text-danger"})
#Html.HiddenFor(model => model.UserId)
<div class="form-group">
#Html.LabelFor(model => model.OldPassword, htmlAttributes: new {#class = "control-label col-md-2"})
<div class="col-md-10">
#Html.EditorFor(model => model.OldPassword, new {htmlAttributes = new {#class = "form-control"}})
#Html.ValidationMessageFor(model => model.OldPassword, "", new {#class = "text-danger"})
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.NewPassword, htmlAttributes: new {#class = "control-label col-md-2"})
<div class="col-md-10">
#Html.EditorFor(model => model.NewPassword, new {htmlAttributes = new {#class = "form-control"}})
#Html.ValidationMessageFor(model => model.NewPassword, "", new {#class = "text-danger"})
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.ConfirmNewPassword, htmlAttributes: new {#class = "control-label col-md-2"})
<div class="col-md-10">
#Html.EditorFor(model => model.ConfirmNewPassword, new {htmlAttributes = new {#class = "form-control"}})
#Html.ValidationMessageFor(model => model.ConfirmNewPassword, "", new {#class = "text-danger"})
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Reset Password" class="btn btn-default"/>
</div>
</div>
</div>
}
I want to be able to add something like:
<p class ="alert alert-success"> <strong>Success! </strong>Your Password has been successfully changed.</p>
Question 1: How to get this to be displayed when password is reset.
Question 2: Currently I am doing return view(data) in the controller. Is it necessary.
Question 3: Can I use something like partialview. I am beginner. Please guide me.
Add a property like ShowMessage to your model and set it if the reset was successful.
Change the view to
#if (model.ShowMessage)
{
<p class="alert alert-success"> <strong>Success! </strong>Your Password has been successfully changed.</p>
}
...
ViewBag.SaveResult=true;
return View(data);
.....
in view page
#if (ViewBag.SaveResult == true) {
<div class="alert alert-success" >
<strong>Success! </strong>Your Password has been successfully changed.</div>
}
I did this using ValidationMessage.
First in razor page add ValidationMessage for success and error:
#Html.ValidationMessage("ERROR", new { #class = "card-alert alert alert-danger v-message", #style = "display: none;" })
#Html.ValidationMessage("SUCCESS", new { #class = "card-alert alert alert-success v-message", #style = "display: none;" })
Then in controller you send error and success message using:
ModelState.AddModelError("SUCCESS", "Success message !");
ModelState.AddModelError("ERROR", "Error message !");
Add this code in JavaScript witch will display messages when needed:
$(".validation-message").each(function () {
if ($(this).text() !== "") {
$(this).css("display", "block");
}
});
I followed an online tutorial to dynamically add items to a bound list model using ajax, which works perfectly. (http://www.mattlunn.me.uk/blog/2014/08/how-to-dynamically-via-ajax-add-new-items-to-a-bound-list-model-in-asp-mvc-net/comment-page-2/#comment-68909)
My question is, how would I correctly remove items from the list?
Right now what I have done is add a delete link which when clicked removes the item from the view. However, when I submit the form I noticed that the modelState is no longer valid and it has null entries for the item that was removed from the view. So I guess the model is not being updated.
Test.cshtml
#model TesterManager.Models.Test
<div class="form-group">
#Html.LabelFor(model => model.Software, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<div class="form-group">
<div class="col-md-5">
#Html.DropDownListFor(m => m.Software, TesterManager.Models.Helper.GetTestSoftwares(), "Choose a USB Card", new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.Software, "", new { #class = "text-danger" })
</div>
<div class="col-md-5">
#Html.EditorFor(model => model.Version, new { htmlAttributes = new { #class = "form-control", #title = "Enter a USB FW Version", #placeholder = "Enter a USB FW Version" } })
#Html.ValidationMessageFor(model => model.Version, "", new { #class = "text-danger" })
</div>
<div class="col-md-2">
Delete
</div>
</div>
</div>
</div>
AdminTesterConfigurations.cshtml (snippet):
#model TesterManager.Models.AdminTesterConfigurations
<div class="form-group">
<div class="col-md-6">
....
</div>
</div>
<hr />
<div class="form-group">
<div class="col-md-12">
<h3>Test Software</h3>
<div id="test-list">
#Html.EditorForMany(x => x.Tests, x => x.Index)
</div>
<input type="button" id="add-test" value="Add" />
</div>
</div>
RequestEditViewModel.cshtml:
#model TesterManager.Models.RequestEditViewModel
<div class="form-horizontal">
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
#Html.EditorFor(model => model.ShippingLocation)
#Html.EditorFor(model => model.RequesterTesterConfigurations)
#Html.EditorFor(model => model.AdminTesterConfigurations)
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
</div>
Edit.cshtml:
#model TesterManager.Models.RequestEditViewModel
#Styles.Render("~/Content/Edit")
#{
ViewBag.Title = "Edit";
Layout = "~/Views/Shared/_Layout.cshtml";
}
#section Scripts
{
<script>
jQuery(document).ready(function ($) {
$('#add-test').on('click', function () {
jQuery.get('/TesterManager/Request/AddTest').done(function (html) {
$('#test-list').append(html);
});
});
});
</script>
}
#using (Html.BeginForm())
{
<h2>Edit</h2>
#Html.AntiForgeryToken()
#Html.EditorFor(x => x);
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
RequestController.cs
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit(RequestEditViewModel request)
{
if (ModelState.IsValid)
{
Request domainRequest = new Request(request);
requests.Add(domainRequest);
return RedirectToAction("Index");
}
return View(request);
}
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]
public ActionResult AddTest()
{
var request = new RequestEditViewModel();
request.AdminTesterConfigurations.Tests.Add(new Test());
return View(request);
}
I realized that the problem was that when I would remove the item from the list in the view, I was not removing the hidden input for the collection indexer as well. I updated the code to remove the hidden input and it works fine now.
I'm trying to upload a file, but it does not work as expected. I have the following view:
#using (Ajax.BeginForm("RegisterBand", "NewProfile", new AjaxOptions() { HttpMethod = "Post",
InsertionMode = InsertionMode.Replace,
}, new { enctype = "multipart/form-data"}))
{
#Html.AntiForgeryToken()
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-horizontal">
<div class="form-group">
<div class="col-md-10">
Bandname
</div>
<div class="col-md-10">
#Html.EditorFor(x => x.BandProfile.Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(x => x.BandProfile.Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-10">
Genres
</div>
<div class="col-md-10">
#Html.DropDownListFor(x => x.BandProfile.Genres, Enumerable.Empty<SelectListItem>(), new { #class="", multiple = "multiple", style ="width: 100%;"} )
#Html.ValidationMessageFor(x => x.BandProfile.Genres, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-10">
Coverpicture
</div>
<div class="col-md-10">
<input type="file" name="file" id="CoverPicture" />
#Html.ValidationMessageFor(x => x.BandProfile.CoverPicture, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-10">
Description
</div>
<div class="col-md-10">
#Html.EditorFor(x => x.BandProfile.Description, new { htmlAttributes = new { #class = "form-control"} })
#Html.ValidationMessageFor(x => x.BandProfile.Description, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Spara" class="btn btn-success" />
</div>
</div>
</div>
}
Here is my controller:
[HttpPost]
public ActionResult RegisterBand(ProfileViewModel model, HttpPostedFileBase file)
{
if (ModelState.IsValid == false)
{
return Json(JsonRequestBehavior.AllowGet);
}
var bandProfile = _profileService.CreateBandProfile(model.BandProfile, file, UserId);
if (bandProfile != null)
{
userManager.AddToRole(UserId, "Band");
return RedirectToAction("Index", "Welcome");
}
return View("Index");
}
The problem I have is that file always results in null. I can't understand why. How can I find the problem?
The issue here is that you are using the Ajax.BeginForm() helper to create and post your form. However, files cannot be uploaded using AJAX.
You may want to consider using a jQuery-based plug-in to accomplish this, which relies on the use of an <iframe> to handle your uploading operations behind the scenes and posting them to the proper location.
Otherwise, you could consider trying a normal form using Html.BeginForm(), which should work in your scenario (if you don't explicitly need any of the AJAX functionality).
Update
Another issue here is that the constructor that you are using for your Ajax.BeginForm() call is accepting an AjaxOptions and htmlAttributes parameter, which falls in like with this constructor
However, your current use is missing the third RouteValues parameter. You could try adding null in there to see if that makes any difference :
#using(Ajax.BeginForm("RegisterBand",
"NewProfile",
null,
new AjaxOptions() {
HttpMethod = "Post",
InsertionMode = InsertionMode.Replace
},
new { enctype = "multipart/form-data"})){
<!-- Content -->
}
While developing an ASP.NET MVC 4 application I ran into a problem updating a saved image.
Basically when the user selects the edit tab, their re-directed to the content they previously entered.
One such item of that content is an image, and when in the edit menu they can choose to replace the existing image.
I have the other content updating correctly but the image remains the same, when I place a breakpoint on the "edit" ActionResult, it show the image value for the passing model as null? newsArticle.ArticleImage = Null
FYI - Image is saved as a byte array.
Am I missing something ?
Controller....
[HttpPost]
public ActionResult Edit(NewsArticle newsArticle, int id, HttpPostedFileBase Article)
{
try
{
if (ModelState.IsValid)
{
NewsArticle savedArticle= _newsArticle.Get(id);
savedArticle.Body = newsArticle.Body;
savedArticle.Title = newsArticle.Title;
if (newsArticle.ArticleImage == null)
{
newsArticle.ArticleImage = savedArticle.ArticleImage;
}
else
{
using (var binaryReader = new BinaryReader(Request.Files[0].InputStream))
{
newsArticle.ArticleImage = binaryReader.ReadBytes(Request.Files[0].ContentLength);
}
savedArticle.ArticleImage = newsArticle.ArticleImage;
}
if (newsArticle.ImageName == null)
{
newsArticle.ImageName = savedArticle.ImageName;
}
else
{
string imgeName = Path.GetFileName(Article.FileName);
savedArticle.ImageName = imgeName;
}
_uow.SaveChanges();
return RedirectToAction("Index");
}
}
catch (System.Data.DataException)
{
//Log th error(add a variable name after DataExpection)
ModelState.AddModelError("", "Unable to save changes. Try again, and if the problem persists see your system administrator.");
}
return View(newsArticle);
}
View..........
#using (Html.BeginForm("Edit", "Admin", FormMethod.Post, new { enctype = "multipart/form-data", #class = "form-horizontal", id = "newsEditForm" }))
{
#Html.ValidationSummary()
#Html.HiddenFor(model => model.ID)
<div class="control-group">
<label class="control-label">Posted on :</label>
<div class="controls">
<span class="text">#Model.DateCreated.Value.ToShortDateString()</span>
#*#Html.LabelFor(n => n.DateCreated)*#
</div>
</div>
<div class="control-group">
<label class="control-label">#Html.LabelFor(n => n.Title)</label>
<div class="controls">
#Html.TextBoxFor(n => n.Title, new { #class = "span4 m-wrap", rows = 1 })
</div>
</div>
<div class="control-group">
<label class="control-label">#Html.LabelFor(n => n.Body)</label>
<div class="controls">
#Html.TextAreaFor(n => n.Body, new { #class = "span12 ckeditor m-wrap", rows = 4 })
</div>
</div>
<div class="control-group">
<label class="controls">#Html.DisplayTextFor(model => model.ImageName)</label>
<div class="span4 blog-img blog-tag-data">
<div class="editor-field">
<input type="file" name="Article" id="ArticleImage" />
</div>
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn green" id="submitnews"><i class="icon-ok"></i>Submit</button>
#Html.ActionLink("Cancel", "ArticleList", "Admin", null, new { #class = "btn blue" })
#*<button type="button" class="btn blue" onclick="location.href='ArticleList','Admin'">Cancel</button>*#
</div>
}