Save cropped image from session variable to database

[don-E Merson]

I have a situation where a user uploads a file and we put that into a session variable and an imageeditor.
 protected void AsyncUpload1_FileUploaded(object sender, FileUploadedEventArgs e)
        {
            //Clear changes and remove uploaded image from Cache
          ImageEditor_CreateDonor.ResetChanges();
        //   Context.Cache.Remove(Session.SessionID + "UploadedFile");
            using (Stream stream = e.File.InputStream)
            {
                byte[] imgData = new byte[stream.Length];
                stream.Read(imgData, 0, imgData.Length);
                MemoryStream ms = new MemoryStream();
                ms.Write(imgData, 0, imgData.Length);

                Context.Cache.Insert(Session.SessionID + "UploadedFile", ms, null, DateTime.Now.AddMinutes(20), TimeSpan.Zero);
            }
        }

Then we put it into a image editor.
 protected void ImageEditor_CreateDonor_ImageLoading(object sender, ImageEditorLoadingEventArgs args)
        {
           
            //Handle Uploaded images
            if (!Object.Equals(Context.Cache.Get(Session.SessionID + "UploadedFile"), null))
           {
                using (EditableImage image = new EditableImage((MemoryStream)Context.Cache.Get(Session.SessionID + "UploadedFile")))
                {
                    args.Image = image.Clone();
                    args.Cancel = true;
                }
           }
        }
We the image is cropped we save the crop into the session variable.
 protected void RadImgEdt_ImageChanging(object sender, ImageEditorEventArgs e)
        {
           
            Context.Cache.Remove(Session.SessionID + "UploadedFile");
            Context.Cache.Insert(Session.SessionID + "UploadedFile", e.Image, null, DateTime.Now.AddMinutes(20), TimeSpan.Zero);
        }

Now once we save, we want to save in the db which is a byte[] format, it doesn't save correctly. (I will the comments in to show the various things I have tried.
protected void BtnDonorSave_Click(object sender, EventArgs e)
        {
            Boolean isLandingPage = false;
            string rtxtScholarshipName = this.txtScholarshipName.Text;
            string rtxtScholarshipDesc = this.txtScholarshipDesc.Text;
            byte[] fileData;


            MemoryStream file;
            EditableImage eImage;
            try
            {
                //UploadedFile file = AsyncUpload1.UploadedFiles[0];
                //fileData = new byte[file.InputStream.Length];
                //file.InputStream.Read(fileData, 0, fileData.Length);
              
                 file =
                     (MemoryStream) Context.Cache.Get(Session.SessionID + "UploadedFile");
                
                
               // UploadedFile file = AsyncUpload1.UploadedFiles[0];
               // var file = Context.Cache[(Session.SessionID + "UploadedFile")] as  MemoryStream;
                 fileData = new byte[file.Length];
                 file.Read(fileData, 0, fileData.Length);
            }

            catch (ArgumentOutOfRangeException e1)
            {
                Response.Write("<script>alert('Donor cannot be added without an image');</script>");
               
                return;
            }
       

            Int32 rcollegeId = Convert.ToInt32(this.collegeId.SelectedValue);
            string rtxtNotes = this.txtNotes.Text;
            if (chkBxNotes.Checked == true)
                isLandingPage = true;


            db.CreateDonor(rcollegeId, rtxtScholarshipName, rtxtScholarshipDesc, ReadFully(Context.Cache.Get(Session.SessionID + "UploadedFile") as MemoryStream), rtxtNotes, User.Identity.Name, DateTime.Now, isLandingPage.ToString()).Execute();
            //Response.Write("<script>alert('Donor Created');</script>");
            Session["CollDiv"] = collegeId.SelectedValue;
            Response.Redirect("DonorProfiles.aspx");
        }

So after save when I try to view the image it is a bad image.

Anyone know how to save a cropped image into a database from an imageeditor?

Thanks

[Vessy]

Hello,

When you want to save an edited image to a custom location (say another file, data base, etc.) you have to use the ImageEditor's saveImageOnServer() method in order to pass the made edits to the server, triggering the ImageSaving event. After that you can handle the ImageSaving event, saving the image to the desired custom location. You can review this approach in details in the following live demo: Save Image to a Custom Location


Regards,
Vessy
Telerik