In this Blog, you can find complete Source Code as well as Visual Studio Project of Complete Crud App With Images in ASP.Net MVC.
Home Controller Source Code
using CrudAppWithImagesInMVC.Models;
using System;
using System.Collections.Generic;
using System.Data.Entity;
using System.IO;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace CrudAppWithImagesInMVC.Controllers
{
public class HomeController : Controller
{
// GET: Home
ExampleDBEntities db = new ExampleDBEntities();
public ActionResult Index()
{
var data = db.employees.ToList();
return View(data);
}
public ActionResult Create()
{
return View();
}
[HttpPost]
public ActionResult Create(employee e)
{
if(ModelState.IsValid == true)
{
string fileName = Path.GetFileNameWithoutExtension(e.ImageFile.FileName);
string extension = Path.GetExtension(e.ImageFile.FileName);
HttpPostedFileBase postedFile = e.ImageFile;
int length = postedFile.ContentLength;
if(extension.ToLower() == ".jpg" || extension.ToLower() == ".jpeg" || extension.ToLower() == ".png")
{
if(length <= 1000000)
{
fileName = fileName + extension;
e.image_path = "~/images/" + fileName;
fileName = Path.Combine(Server.MapPath("~/images/"),fileName);
e.ImageFile.SaveAs(fileName);
db.employees.Add(e);
int a = db.SaveChanges();
if(a > 0)
{
TempData["CreateMessage"] = "<script>alert('Data Inserted Successfully.')</script>";
ModelState.Clear();
return RedirectToAction("Index","Home");
}
else
{
TempData["CreateMessage"] = "<script>alert('Data Not Inserted.')</script>";
}
}
else
{
TempData["SizeMessage"] = "<script>alert('Image Size should be less than 1 MB')</script>";
}
}
else
{
TempData["ExtensionMessage"] = "<script>alert('Format Not Supported')</script>";
}
}
return View();
}
public ActionResult Edit(int id)
{
var EmployeeRow = db.employees.Where(model => model.id == id).FirstOrDefault();
Session["Image"] = EmployeeRow.image_path;
return View(EmployeeRow);
}
[HttpPost]
public ActionResult Edit(employee e)
{
if(ModelState.IsValid == true)
{
if(e.ImageFile != null)
{
string fileName = Path.GetFileNameWithoutExtension(e.ImageFile.FileName);
string extension = Path.GetExtension(e.ImageFile.FileName);
HttpPostedFileBase postedFile = e.ImageFile;
int length = postedFile.ContentLength;
if (extension.ToLower() == ".jpg" || extension.ToLower() == ".jpeg" || extension.ToLower() == ".png")
{
if (length <= 1000000)
{
fileName = fileName + extension;
e.image_path = "~/images/" + fileName;
fileName = Path.Combine(Server.MapPath("~/images/"), fileName);
e.ImageFile.SaveAs(fileName);
db.Entry(e).State = EntityState.Modified;
int a = db.SaveChanges();
if (a > 0)
{
string ImagePath = Request.MapPath(Session["Image"].ToString());
if (System.IO.File.Exists(ImagePath))
{
System.IO.File.Delete(ImagePath);
}
TempData["UpdateMessage"] = "<script>alert('Data Updated Successfully.')</script>";
ModelState.Clear();
return RedirectToAction("Index", "Home");
}
else
{
TempData["UpdateMessage"] = "<script>alert('Data Not Updated.')</script>";
}
}
else
{
TempData["SizeMessage"] = "<script>alert('Image Size should be less than 1 MB')</script>";
}
}
else
{
TempData["ExtensionMessage"] = "<script>alert('Format Not Supported')</script>";
}
}
else
{
e.image_path = Session["Image"].ToString();
db.Entry(e).State = EntityState.Modified;
int a = db.SaveChanges();
if (a > 0)
{
TempData["UpdateMessage"] = "<script>alert('Data Updated Successfully.')</script>";
ModelState.Clear();
return RedirectToAction("Index", "Home");
}
else
{
TempData["UpdateMessage"] = "<script>alert('Data Not Updated.')</script>";
}
}
}
return View();
}
public ActionResult Delete(int id)
{
if(id > 0)
{
var EmployeeRow = db.employees.Where(model => model.id == id).FirstOrDefault();
if(EmployeeRow != null)
{
db.Entry(EmployeeRow).State = EntityState.Deleted;
int a = db.SaveChanges();
if(a > 0)
{
TempData["DeleteMessage"] = "<script>alert('Data Deleted Successfully.')</script>";
string ImagePath = Request.MapPath(EmployeeRow.image_path.ToString());
if(System.IO.File.Exists(ImagePath))
{
System.IO.File.Delete(ImagePath);
}
}
else
{
TempData["DeleteMessage"] = "<script>alert('Data Not Deleted.')</script>";
}
}
}
return RedirectToAction("Index","Home");
}
public ActionResult Details(int id)
{
var EmployeeRow = db.employees.Where(model => model.id == id).FirstOrDefault();
Session["Image2"] = EmployeeRow.image_path.ToString();
return View(EmployeeRow);
}
}
}Context Class Source Code
//------------------------------------------------------------------------------
// <auto-generated>
// This code was generated from a template.
//
// Manual changes to this file may cause unexpected behavior in your application.
// Manual changes to this file will be overwritten if the code is regenerated.
// </auto-generated>
//------------------------------------------------------------------------------
namespace CrudAppWithImagesInMVC.Models
{
using System;
using System.Data.Entity;
using System.Data.Entity.Infrastructure;
public partial class ExampleDBEntities : DbContext
{
public ExampleDBEntities()
: base("name=ExampleDBEntities")
{
}
protected override void OnModelCreating(DbModelBuilder modelBuilder)
{
throw new UnintentionalCodeFirstException();
}
public virtual DbSet<employee> employees { get; set; }
}
}
Create.cshtml Source Code
@model CrudAppWithImagesInMVC.Models.employee
@{
ViewBag.Title = "Create";
}
<h2>Create</h2>
@Html.Raw(TempData["CreateMessage"])
@Html.Raw(TempData["SizeMessage"])
@Html.Raw(TempData["ExtensionMessage"])
@using (Html.BeginForm("Create","Home",FormMethod.Post, new {enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>employee</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.name, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.name, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.name, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.designation, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.designation, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.designation, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.image_path, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<input type="file" name="ImageFile" required />
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
Details.cshtml Source Code
@model CrudAppWithImagesInMVC.Models.employee
@{
ViewBag.Title = "Details";
}
<h2>Details</h2>
<div>
<h4>employee</h4>
<hr />
<dl class="dl-horizontal">
<dt>
@Html.DisplayNameFor(model => model.id)
</dt>
<dd>
@Html.DisplayFor(model => model.id)
</dd>
<dt>
@Html.DisplayNameFor(model => model.name)
</dt>
<dd>
@Html.DisplayFor(model => model.name)
</dd>
<dt>
@Html.DisplayNameFor(model => model.designation)
</dt>
<dd>
@Html.DisplayFor(model => model.designation)
</dd>
<dt>
@Html.DisplayNameFor(model => model.image_path)
</dt>
<dd>
<img src="@Url.Content(Session["Image2"].ToString())" height="80" width="80" />
</dd>
</dl>
</div>
<p>
@Html.ActionLink("Edit", "Edit", new { id = Model.id }) |
@Html.ActionLink("Back to List", "Index")
</p>
Edit.cshtml Source Code
@model CrudAppWithImagesInMVC.Models.employee
@{
ViewBag.Title = "Edit";
}
<h2>Edit</h2>
@Html.Raw(TempData["UpdateMessage"])
@Html.Raw(TempData["SizeMessage"])
@Html.Raw(TempData["ExtensionMessage"])
@using (Html.BeginForm("Edit", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>employee</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model => model.id)
<div class="form-group">
@Html.LabelFor(model => model.name, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.name, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.name, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.designation, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.designation, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.designation, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.image_path, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<img src="@Url.Content(Session["Image"].ToString())" height="80" width="80" />
<br />
<input type="file" name="ImageFile" />
</div>
</div>
<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>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
Index.cshtml Source Code
@model IEnumerable<CrudAppWithImagesInMVC.Models.employee>
@{
ViewBag.Title = "Index";
}
<h2>Index</h2>
@Html.Raw(TempData["CreateMessage"])
@Html.Raw(TempData["UpdateMessage"])
@Html.Raw(TempData["DeleteMessage"])
<p>
@Html.ActionLink("Create New", "Create")
</p>
<table class="table">
<tr>
<th>
@Html.DisplayNameFor(model => model.name)
</th>
<th>
@Html.DisplayNameFor(model => model.designation)
</th>
<th>
@Html.DisplayNameFor(model => model.image_path)
</th>
<th></th>
</tr>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.name)
</td>
<td>
@Html.DisplayFor(modelItem => item.designation)
</td>
<td>
<img src="@Url.Content(item.image_path)" height="80" width="80" />
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id=item.id }) |
@Html.ActionLink("Details", "Details", new { id=item.id }) |
@Html.ActionLink("Delete", "Delete", new { id=item.id })
</td>
</tr>
}
</table>
Web.Config Source Code
<?xml version="1.0" encoding="utf-8"?>
<!--
For more information on how to configure your ASP.NET application, please visit
http://go.microsoft.com/fwlink/?LinkId=301880
-->
<configuration>
<configSections>
<!-- For more information on Entity Framework configuration, visit http://go.microsoft.com/fwlink/?LinkID=237468 -->
<section name="entityFramework" type="System.Data.Entity.Internal.ConfigFile.EntityFrameworkSection, EntityFramework, Version=6.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" requirePermission="false" />
<!-- For more information on Entity Framework configuration, visit http://go.microsoft.com/fwlink/?LinkID=237468 --></configSections>
<appSettings>
<add key="webpages:Version" value="3.0.0.0" />
<add key="webpages:Enabled" value="false" />
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>
<system.web>
<compilation debug="true" targetFramework="4.5.2" />
<httpRuntime targetFramework="4.5.2" />
<httpModules>
<add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" />
</httpModules>
</system.web>
<runtime>
<assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
<dependentAssembly>
<assemblyIdentity name="System.Web.Helpers" publicKeyToken="31bf3856ad364e35" />
<bindingRedirect oldVersion="1.0.0.0-3.0.0.0" newVersion="3.0.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.WebPages" publicKeyToken="31bf3856ad364e35" />
<bindingRedirect oldVersion="1.0.0.0-3.0.0.0" newVersion="3.0.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.Mvc" publicKeyToken="31bf3856ad364e35" />
<bindingRedirect oldVersion="1.0.0.0-5.2.3.0" newVersion="5.2.3.0" />
</dependentAssembly>
</assemblyBinding>
</runtime>
<system.codedom>
<compilers>
<compiler language="c#;cs;csharp" extension=".cs" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.CSharpCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:6 /nowarn:1659;1699;1701" />
<compiler language="vb;vbs;visualbasic;vbscript" extension=".vb" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.VBCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:14 /nowarn:41008 /define:_MYTYPE=\"Web\" /optionInfer+" />
</compilers>
</system.codedom>
<system.webServer>
<validation validateIntegratedModeConfiguration="false" />
<modules>
<remove name="ApplicationInsightsWebTracking" />
<add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler" />
</modules>
</system.webServer>
<entityFramework>
<defaultConnectionFactory type="System.Data.Entity.Infrastructure.LocalDbConnectionFactory, EntityFramework">
<parameters>
<parameter value="mssqllocaldb" />
</parameters>
</defaultConnectionFactory>
<providers>
<provider invariantName="System.Data.SqlClient" type="System.Data.Entity.SqlServer.SqlProviderServices, EntityFramework.SqlServer" />
</providers>
</entityFramework>
<connectionStrings>
<add name="ExampleDBEntities" connectionString="metadata=res://*/Models.EmployeeDBModel.csdl|res://*/Models.EmployeeDBModel.ssdl|res://*/Models.EmployeeDBModel.msl;provider=System.Data.SqlClient;provider connection string="data source=MOHAMMADADIL-PC;initial catalog=ExampleDB;integrated security=True;MultipleActiveResultSets=True;App=EntityFramework"" providerName="System.Data.EntityClient" />
</connectionStrings>
</configuration>Click Below Link to Download Visual Studio Project / Source Code Of This Blog
https://www.mediafire.com/file/qrm4v6vxbfzuj6x/CrudAppWithImagesInMVC.rar/file
No responses yet