Asp.net + JCrop : Easy way to crop and save an image to folder in Asp.net c# jQuery

/ / 0 Comments
Overview: Here in this article we are going to see how to crop an image using jQuery awesome plugin i.e JCrop in Asp.net C#  and save this cropped image into our web application image folder.  

Why do I use jCrop plugin?

Jcrop plugin is the quick and easy way to add image cropping functionality to your web application. It combines the ease-of-use of a typical jQuery plugin with a powerful cross-platform DHTML cropping engine that is faithful to familiar desktop graphics applications. It's easy to implement in our Asp.net Application.

Steps to implement image crop functionality:

  1.  Download files : jQuery and jCrop latest files .i.e jCrop.js and jCrop.css.
  2. Client-side code: jQuery code which initializes jCrop and implements image crop functionality to the given image.
  3.  Server-side code: C#, save the cropped image co-ordinates in the folder.
  4. Yeah, hit F5 button to check the output :-)

Download and Include jQuery and jCrop Files.

Create a new project in asp.net, and add a new page and include the downloaded file under the head tag, so now your head tag looks like as shown in below code.
//*
<head>
    <script src="jquery.min.js"></script>
    <script src="jCrop/js/jquery.Jcrop.min.js"></script>
    <link href="jCrop/css/jquery.Jcrop.css" rel="stylesheet" />
</head>
//*
      You might get this error while save cropped image: Error: A generic error occurred in GDI+ ********************************************* LSI WORDS: asp.net crop and resize image crop image using c# c# code for cropping image c# crop image rectangle crop image using .net 4 how to crop a picture in c# c# cut image c# crop image and save crop image in asp.net c# crop image using .net 4 crop and resize image photoshop crop and resize image in jquery crop and resize image css crop and resize image software crop and resize image gimp crop and resize image in php Searches related to inurl:forum + jcrop upload and crop image jCrop + Asp.net : Upload and crop images with jquery jcrop and Asp.net C# jcrop resize image jcrop change image jcrop change image preview jcrop save image jcrop image size jcrop resize selection Sentences: how to crop image in asp.net using jcrop jQuery plugin or jQuery image ... ASP.NET,C# I will explain how to Crop and Upload Image with Live Thumbnail Preview using jQuery and HTML5 Canvas in ASP.Net with C# Upload and Crop Images with jQuery, JCrop and ASP.NET How to crop image and save the cropped image using asp.net and jquery Using JCrop I get selected Area of uploaded image and using C# Image Editing: Saving, Cropping, and Resizing Net Using jQuery and jCrop,Image cropping is a technique where a portion of a larger image can be selected Today, I'm going to show you how to combine jQuery, jCrop, and ImageResizing.Net to create an AJAX cropping interface crop image in asp.net using jcrop jquery Image Cropping in ASP.Net Using jQuery and jCrop,Image cropping is a technique where a portion of a larger image can be selected and The link to jQuery makes use of the copy available from the Google Ajax API Library for better caching and faster downloading Here in this article we are going to see how to upload and crop an image in Asp.net C# using jCrop jQuery an awesome plugin i.e using JCrop in Asp.net C#, we crop an Image and save this cropped image into our Asp.net web application image folder. Basically, i'm going to show how to combine jQuery,jCrop and Asp.net C# to create an AJAX cropping interface for cropping and saving Bonus : You might have some question or quires like Question 1 :How do I remove jcrop? or how i un-jcrop an image? First you need to maintain a reference to the api when you add jcrop to an image. Suppose you want to remove jcrop after applied once, then you can chech this how to remove jcrop or un-jcrop by writting jcrop_api.destroy(); Question 2 : JQuery JCrop - How to set a fixed size selection area? http://stackoverflow.com/questions/346045/jquery-jcrop-how-to-set-a-fixed-size-selection-area Question 3 : Jcrop not cropping properly the images http://stackoverflow.com/questions/17919733/jcrop-not-cropping-properly-the-images Question 4: jcrop setSelect problem  

Thank you for reading, pls keep visiting this blog and share this in your network. Also, I would love to hear your opinions down in the comments.

PS: If you found this content valuable and want to thank me? 👳 Buy Me a Coffee

Subscribe to our newsletter

Get the latest and greatest from Codepedia delivered straight to your inbox.


Post Comment

Your email address will not be published. Required fields are marked *

0 Comments