Step 1: Download project and add scripts into your project under a Scripts folder.
Step 2: Follow the below code in .aspx and .cs files.
.Aspx page
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="crop_image.aspx.cs" Inherits="_Default" %>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head id="Head1" runat="server">
  5. <title></title>
  6. <link href="Scripts/jquery.Jcrop.css" temp_href="Scripts/jquery.Jcrop.css" rel="stylesheet"
  7. type="text/css" />
  8. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"
  9. temp_src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
  10. <script type="text/javascript" src="Scripts/jquery.Jcrop.js" temp_src="Scripts/jquery.Jcrop.js"></script>
  11. <script type="text/javascript">
  12. jQuery(document).ready(function () {
  13. jQuery('#imgCrop').Jcrop({
  14. onSelect: storeCoords
  15. });
  16. });
  17. function storeCoords(c) {
  18. jQuery('#X').val(c.x);
  19. jQuery('#Y').val(c.y);
  20. jQuery('#W').val(c.w);
  21. jQuery('#H').val(c.h);
  22. };
  23. </script>
  24. </head>
  25. <body>
  26. <form id="form1" runat="server">
  27. <div>
  28. <asp:Panel ID="pnlUpload" runat="server">
  29. <asp:FileUpload ID="Upload" runat="server" />
  30. <br />
  31. <asp:Button ID="btnUpload" runat="server" OnClick="btnUpload_Click" Text="Upload" />
  32. <asp:Label ID="lblError" runat="server" Visible="false" />
  33. </asp:Panel>
  34. <asp:Panel ID="pnlCrop" runat="server" Visible="false">
  35. <asp:Image ID="imgCrop" runat="server" />
  36. <br />
  37. <asp:HiddenField ID="X" runat="server" />
  38. <asp:HiddenField ID="Y" runat="server" />
  39. <asp:HiddenField ID="W" runat="server" />
  40. <asp:HiddenField ID="H" runat="server" />
  41. <asp:Button ID="btnCrop" runat="server" Text="Crop" OnClick="btnCrop_Click" />
  42. </asp:Panel>
  43. <asp:Panel ID="pnlCropped" runat="server" Visible="false">
  44. <asp:Image ID="imgCropped" runat="server" />
  45. </asp:Panel>
  46. </div>
  47. </form>
  48. </body>
  49. </html>
.cs Page
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Web;
  5. using System.Web.UI;
  6. using System.Web.UI.WebControls;
  7. using System.IO;
  8. using SD = System.Drawing;
  9. using System.Drawing.Imaging;
  10. using System.Drawing.Drawing2D;
  11. public partial class _Default : System.Web.UI.Page
  12. {
  13. String path = HttpContext.Current.Request.PhysicalApplicationPath + "images\\";
  14. protected void Page_Load(object sender, EventArgs e)
  15. {
  16. }
  17. protected void btnUpload_Click(object sender, EventArgs e)
  18. {
  19. Boolean FileOK = false;
  20. Boolean FileSaved = false;
  21. if (Upload.HasFile)
  22. {
  23. Session["WorkingImage"] = Upload.FileName;
  24. String FileExtension = Path.GetExtension(Session["WorkingImage"].ToString()).ToLower();
  25. String[] allowedExtensions = { ".png", ".jpeg", ".jpg", ".gif" };
  26. for (int i = 0; i < allowedExtensions.Length; i++)
  27. {
  28. if (FileExtension == allowedExtensions[i])
  29. {
  30. FileOK = true;
  31. }
  32. }
  33. }
  34. if (FileOK)
  35. {
  36. try
  37. {
  38. Upload.PostedFile.SaveAs(path + Session["WorkingImage"]);
  39. FileSaved = true;
  40. }
  41. catch (Exception ex)
  42. {
  43. lblError.Text = "File could not be uploaded." + ex.Message.ToString();
  44. lblError.Visible = true;
  45. FileSaved = false;
  46. }
  47. }
  48. else
  49. {
  50. lblError.Text = "Cannot accept files of this type.";
  51. lblError.Visible = true;
  52. }
  53. if (FileSaved)
  54. {
  55. pnlUpload.Visible = false;
  56. pnlCrop.Visible = true;
  57. imgCrop.ImageUrl = "images/" + Session["WorkingImage"].ToString();
  58. }
  59. }
  60. protected void btnCrop_Click(object sender, EventArgs e)
  61. {
  62. string ImageName = Session["WorkingImage"].ToString();
  63. int w = Convert.ToInt32(W.Value);
  64. int h = Convert.ToInt32(H.Value);
  65. int x = Convert.ToInt32(X.Value);
  66. int y = Convert.ToInt32(Y.Value);
  67. byte[] CropImage = Crop(path + ImageName, w, h, x, y);
  68. using (MemoryStream ms = new MemoryStream(CropImage, 0, CropImage.Length))
  69. {
  70. ms.Write(CropImage, 0, CropImage.Length);
  71. using (SD.Image CroppedImage = SD.Image.FromStream(ms, true))
  72. {
  73. string SaveTo = path + "crop" + ImageName;
  74. CroppedImage.Save(SaveTo, CroppedImage.RawFormat);
  75. pnlCrop.Visible = false;
  76. pnlCropped.Visible = true;
  77. imgCropped.ImageUrl = "images/crop" + ImageName;
  78. }
  79. }
  80. }
  81. static byte[] Crop(string Img, int Width, int Height, int X, int Y)
  82. {
  83. try
  84. {
  85. using (SD.Image OriginalImage = SD.Image.FromFile(Img))
  86. {
  87. using (SD.Bitmap bmp = new SD.Bitmap(Width, Height))
  88. {
  89. bmp.SetResolution(OriginalImage.HorizontalResolution, OriginalImage.VerticalResolution);
  90. using (SD.Graphics Graphic = SD.Graphics.FromImage(bmp))
  91. {
  92. Graphic.SmoothingMode = SmoothingMode.AntiAlias;
  93. Graphic.InterpolationMode = InterpolationMode.HighQualityBicubic;
  94. Graphic.PixelOffsetMode = PixelOffsetMode.HighQuality;
  95. Graphic.DrawImage(OriginalImage, new SD.Rectangle(0, 0, Width, Height), X, Y, Width, Height, SD.GraphicsUnit.Pixel);
  96. MemoryStream ms = new MemoryStream();
  97. bmp.Save(ms, OriginalImage.RawFormat);
  98. return ms.GetBuffer();
  99. }
  100. }
  101. }
  102. }
  103. catch (Exception Ex)
  104. {
  105. throw (Ex);
  106. }
  107. }
  108. }
For more download the project.
Here is another tutorial on Crop and Save Image in ASP.NET