image preview from temprorary folder

[shaik Mohammed]

Hi,

i want to save image in temporary folder and get preview on upload file

Regards
Yasin

[Shinu]

Hi,

It is not a good idea to display images from the Temporary folder, because it is cleared periodically. Better display it from the Target folder as follows.

ASPX:

<telerik:RadAsyncUpload ID="radasyncuploadPreviewImage" runat="server" TargetFolder="Uploads"
    OnFileUploaded="radasyncuploadPreviewImage_FileUploaded">
</telerik:RadAsyncUpload>
<telerik:RadButton ID="radbtnPreviewImage" runat="server" Text="Preview">
</telerik:RadButton>
<telerik:RadBinaryImage ID="radbinimgPreviwImage" runat="server" />

C#:

protected void radasyncuploadPreviewImage_FileUploaded(object sender, Telerik.Web.UI.FileUploadedEventArgs e)
{
    radbinimgPreviwImage.ImageUrl = radasyncuploadPreviewImage.TargetFolder+"/" + e.File.FileName;
}

Let me know if you have any concern.
Thanks,
Shinu.

[shaik Mohammed]

Hi Shinu,

Thank for your quick response,

i have a scenario for new user profile, user has to select image from the computer,and automatically image preview will appear with crop option. once crop is done then user can submit his image and other data on server with the submit button.
i don't want to save big/original image on server with out cropping, because server space will be shortage. i hope with temporary folder will delete images automatically after 4 hours.
Please i need any scrip for logic to achieve my scenario
Regards,
Yasin

[Shinu]

Hi shaik Mohammed,

Please try the approach mentioned in this online demo to achieve your scenario.

Thanks,
Shinu.

[shaik Mohammed]

But the example is saving data in database.

private byte[] GetImage(int id)
   {
       string connectionString = System.Configuration.ConfigurationManager.ConnectionStrings["TelerikConnectionString35"].ConnectionString;

       using (SqlConnection conn = new SqlConnection(connectionString))
       {
           string cmdText = "SELECT ImageData FROM AsyncUploadImages WHERE ImageID = @ImageID;";

           SqlCommand cmd = new SqlCommand(cmdText, conn);
           SqlParameter idParam = new SqlParameter("@ImageID", SqlDbType.Int);
           idParam.Value = id;

           cmd.Parameters.Add(idParam);
           conn.Open();

           using (SqlDataReader reader = cmd.ExecuteReader())
           {
               if (reader.Read())
               {
                   byte[] imageData = (byte[])reader["ImageData"];
                   return imageData;
               }
               else
               {
                   throw new ArgumentException("Invalid ID");
               }
           }
       }
   }

 what if some one uploaded image and suddenly closed browse? it will always in database.
custom handler is nice option, but could you please post script that can be use temporary folder?

Regards,
Yasin

[Shinu]

Hi shaik Mohammed,

Basically Temporary file directory is used only internally in RadAsyncUpload and the files in it should not be modified and that is why they can not be used from the server. In order to achieve your scenario one suggestion is that you can use the Custom Http Handler.

Thanks,
Shinu.

[Peter Filipov]

Hello Yasin,

You could use custom handler and upload the file in a particular folder and then return the ID of the image and show it like in the demo. I am sending you a sample project for a reference.

Regards,
Peter Filipov
Telerik

 

 

[shaik Mohammed]

[quote]Peter Filipov said:Hello Yasin,

You could use custom handler and upload the file in a particular folder and then return the ID of the image and show it like in the demo. I am sending you a sample project for a reference.

Regards,
Peter Filipov
Telerik

 

 

[/quote]

Dear Peter Filipov ,
I'm very thank full to you. you gave me the demo exactly what i required. and i got little issue on remove image function, after i change temporary folder from "~" to "~/ImageTemp"

TemporaryFolder="~/ImageTemp"

Then i have added "handlerwithpath " to get URL from "ImageTemp"

function getImageUrl(id) {
               var url = window.location.href;
               var handler = id;
               //createrd by yasin
               var handlerwithpath = "ImageTemp/" + handler;
               var index = url.lastIndexOf("/");
               var completeUrl = url.substring(0, index + 1) + handlerwithpath;
               return completeUrl
           }

Everything is working perfectly but, i cannot able to remove file with remove function

function fileUploadRemoving(sender, args) {
               var index = args.get_rowIndex();
               $(".imageContainer img:eq(" + index + ")").remove();
           }

Please help

Regards,
Yasin

[Hristo Valyavicharski]

Hi Yasin,

Are you getting a javascript error? Do you have java jQuery reference?

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    <Scripts>
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
    </Scripts>
</telerik:RadScriptManager>

Regards,
Hristo Valyavicharski
Telerik

 

 

[shaik Mohammed]

[quote]Hristo Valyavicharski said:Hi Yasin,

Are you getting a javascript error? Do you have java jQuery reference?

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    <Scripts>
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
    </Scripts>
</telerik:RadScriptManager>

Regards,
Hristo Valyavicharski
Telerik

 

 

[/quote]

Hi Hristo,

I'm not getting any errors, i want to remove image from temporary image folder on asp.net button click event .and how can i set time for automatically delete image after 5 minutes from tempfolder?

Thank you

[Hristo Valyavicharski]

Yasin,

There is no need to clear the Temporary Folder. Submitted files will should be moved to the Target folder. Others will be removed automatically depending on the TemporaryFileExpiration property.

Regards,
Hristo Valyavicharski
Telerik