This is a migrated thread and some comments may be shown as answers.

How to extend the RadAsyncUpload handler

5 Answers 290 Views

Upload (Obsolete)

This is a migrated thread and some comments may be shown as answers.

5 Answers, 1 is accepted

answered on 21 Sep 2010, 06:58 PM

I have played with the coed until my block is the return of the IAsyncUploadResult since i am accesing them in this fashion

i get no value returned from 'args.get_fileInfo().i_id; '

i_id is the id of my image id returend from my the DB i see the new id it never gets to the client .

<script type="text/javascript">

//<![CDATA[

function fileUploaded(sender, args) {

var id = args.get_fileInfo().i_id;

alert(id);

$(".imageContainer")

.empty()

.append($("<img />")

.attr("src", getImageUrl(id))

.attr("id ", "newimages4d"));

$(".info")

.html(String.format("<strong>{0}</strong> succesfully insterted. Record ID - {1}", args.get_fileName(), id));

}

function getImageUrl(id) {

var url = window.location.href;

var handler = "StreamImage.ashx?i_id=" + id;

var index = url.lastIndexOf("/");

var completeUrl = url.substring(0, index + 1) + handler;

return completeUrl

}

function clientDeleting(sender, args) {

var index = args.get_rowIndex();

$(".imageContainer img:eq(" + index + ")").remove();

}

//]]>

</script>

answered on 21 Sep 2010, 08:54 PM

I have noticed that after the insert is complete - MyAsyncUploadResult is empty with all ???? for with no paramteres.
but i don't know if my declaration is correct. i have included my process insert statment, the config class, and the

MyAsyncUploadResult set.

Public Class MyAsyncUploadResult

Inherits AsyncUploadResult

Private _i_id As Integer

Private _i_desc As String

Private _i_image As System.Data.Linq.Binary

Private _i_user_name As String

Private _i_fk_post_Id As System.Nullable(Of Integer)

Public Property i_id() As Integer

Get

Return Me._i_id

End Get

Set(ByVal value As Integer)

If ((Me._i_id = value) _

= False) Then

Me._i_id = value

End If

End Set

End Property

Public Property i_desc() As String

Get

Return Me._i_desc

End Get

Set(ByVal value As String)

If (String.Equals(Me._i_desc, value) = False) Then

Me._i_desc = value

End If

End Set

End Property

Public Property i_image() As System.Data.Linq.Binary

Get

Return Me._i_image

End Get

Set(ByVal value As System.Data.Linq.Binary)

If (Object.Equals(Me._i_image, value) = False) Then

Me._i_image = value

End If

End Set

End Property

Public Property i_user_name() As String

Get

Return Me._i_user_name

End Get

Set(ByVal value As String)

If (String.Equals(Me._i_user_name, value) = False) Then

Me._i_user_name = value

End If

End Set

End Property

Public Property i_fk_post_Id() As System.Nullable(Of Integer)

Get

Return Me._i_fk_post_Id

End Get

Set(ByVal value As System.Nullable(Of Integer))

If (Me._i_fk_post_Id.Equals(value) = False) Then

Me._i_fk_post_Id = value

End If

End Set

End Property

End Class

' The upload configuration object is passed from the page to the custom handler.

' You can customize it to include custom properties by extending the AsyncUploadConfiguration class.

' In this case we send the ID of the currently logged-in user to be stored in the database as the auther of the image.

Public Class MyAsyncUploadConfiguration

Inherits AsyncUploadConfiguration

Private _i_id As Integer

Private _i_desc As String

Private _i_image As System.Data.Linq.Binary

Private _i_user_name As String

Private _i_fk_post_Id As System.Nullable(Of Integer)

Public Property i_id() As Integer

Get

Return Me._i_id

End Get

Set(ByVal value As Integer)

If ((Me._i_id = value) _

= False) Then

Me._i_id = value

End If

End Set

End Property

Public Property i_desc() As String

Get

Return Me._i_desc

End Get

Set(ByVal value As String)

If (String.Equals(Me._i_desc, value) = False) Then

Me._i_desc = value

End If

End Set

End Property

Public Property i_image() As System.Data.Linq.Binary

Get

Return Me._i_image

End Get

Set(ByVal value As System.Data.Linq.Binary)

If (Object.Equals(Me._i_image, value) = False) Then

Me._i_image = value

End If

End Set

End Property

Public Property i_user_name() As String

Get

Return Me._i_user_name

End Get

Set(ByVal value As String)

If (String.Equals(Me._i_user_name, value) = False) Then

Me._i_user_name = value

End If

End Set

End Property

Public Property i_fk_post_Id() As System.Nullable(Of Integer)

Get

Return Me._i_fk_post_Id

End Get

Set(ByVal value As System.Nullable(Of Integer))

If (Me._i_fk_post_Id.Equals(value) = False) Then

Me._i_fk_post_Id = value

End If

End Set

End Property

End Class

' Call the base Process method to save the file to the temporary folder

' base.Process(file, context, configuration, tempFileName);

' Populate the default (base) result into an object of type SampleAsyncUploadResult

Dim result As MyAsyncUploadResult = CreateDefaultUploadResult(Of MyAsyncUploadResult)(file)

Dim vals As New localhost._sp_ImagesResult

Dim userID As Integer = -1

' You can obtain any custom information passed from the page via casting the configuration parameter to your custom class

Dim myConfiguration As MyAsyncUploadConfiguration = TryCast(configuration, MyAsyncUploadConfiguration)

Dim imageData As Byte() = GetImageBytes(File.InputStream)

If myConfiguration IsNot Nothing Then

vals.i_desc = myConfiguration.i_desc

vals.i_fk_post_Id = myConfiguration.i_fk_post_Id

vals.i_user_name = myConfiguration.i_user_name

End If

' Populate any additional fields into the upload result.

' The upload result is available both on the client and on the server

result.i_id = InsertImage(file, vals)

Return result

End Function

Public Function InsertImage(ByVal file As UploadedFile, ByVal vals As localhost._sp_ImagesResult) As Integer

Dim connectionString As String = System.Configuration.ConfigurationManager.ConnectionStrings("4dpeepsconnect").ConnectionString

Using conn As New SqlConnection(connectionString)

Dim cmdText As String = "insert into images ( i_desc , i_image,i_user_name ,i_fk_post_Id )  values (@i_desc ,@i_image ,@i_user_name ,@i_fk_post_Id)   SET @Identity = SCOPE_IDENTITY()"

Dim cmd As New SqlCommand(cmdText, conn)

Dim imageData As Byte() = GetImageBytes(file.InputStream)

Dim identityParam As New SqlParameter("@Identity", SqlDbType.Int, 0, "i_id")

identityParam.Direction = ParameterDirection.Output

cmd.Parameters.AddWithValue("@i_image", imageData)

cmd.Parameters.AddWithValue("@i_desc", file.GetName())

cmd.Parameters.AddWithValue("@i_fk_post_Id", 0)

cmd.Parameters.AddWithValue("@i_user_name", My.User.Name)

cmd.Parameters.Add(identityParam)

conn.Open()

cmd.ExecuteNonQuery()

Return CInt(identityParam.Value)

End Using

End Function

attached is an img of the error msg

answered on 22 Sep 2010, 11:22 AM

after a little more debugging i found out that the src of the image was incorrect. But now comes the question how do i delete the unwanted images from the database i extened the functionality by adding a delete handler and keep track of the id so when the user deletes the image i clear the text and delet the image from the database. I am only allowing one image per upload but this can be done for multiple images if you set the image id to the database id and use that to delete the selected user image
My ending javascript looks like this .

<script type="text/javascript">

//<![CDATA[

var id;

function fileUploaded(sender, args) {

id = args.get_fileInfo().i_id;

$(".imageContainer")

.empty()

.append($("<img />")

.attr("src", getImageUrl(id)));

// alert(getImageUrl(id));

$(".info")

.html(String.format("<strong>{0}</strong> succesfully insterted. Record ID - {1}", args.get_fileName(), id));

}

function getImageUrl(id) {

var url = window.location.href;

var handler = "StreamImage.ashx?i_id=" + id;

var index = url.lastIndexOf("/");

var completeUrl = url.substring(0, index + 1) + handler;

// alert(completeUrl);

return completeUrl

}

function clientDeleting(sender, args) {

var index = args.get_rowIndex();

$(".imageContainer img:eq(" + index + ")").remove();

alert(id);

$(".imageContainer")

.append($("<img />")

.attr("src", DeleteImageUrl(id)))

.empty();

$(".info")

.html(String.format("", "", ""));

}

function DeleteImageUrl(id) {

var url = window.location.href;

var handler = "DeleteStream.ashx?i_id=" + id;

var index = url.lastIndexOf("/");

var completeUrl = url.substring(0, index + 1) + handler;

// alert(completeUrl);

return completeUrl

}

//]]>

</script>

</telerik:RadCodeBlock>

<div class="imageContainer">

</div>

<telerik:RadAsyncUpload runat="server" ID="RadAsyncUpload1" HttpHandlerUrl="~/UserControls/uploadControl/Handler.ashx"

OnClientFileUploaded="fileUploaded" OnClientDeleting="clientDeleting" FocusOnLoad="True"

InputSize="30" MaxFileInputsCount="1" Skin="Telerik">

</telerik:RadAsyncUpload>

<span class="info"></span>

<h5>

<span>Only the last Image Uploaded will be used</span></h5>

answered on 25 Sep 2010, 05:10 AM

Hello Genady ,
Thank you. I wished you had a way to code so addition functionality such as a

OnClientEdit or some type of event

So we can do and update of the picture. for eq. I have one picture  I have no image input so to replace the picture you must delete and insert a new pic if we had that new ability i could grab the id of the file already loaded and do an update same goes for the multiple pictures a input dialogue could be given with a return of the the new image to repaint the div with the new image and updated msge and id

since i am using one image at a time I was going to trying to use a tool tip   so i can try to pass it to the new page ,a new radloader could use an edit handler to update the image but i need a way to pass the image id back from the tool tip and reload the new image and or update the msg so i fall sort on that approach but I will play with it a little

Sincerely Dwayne

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting

Testing & Mocking

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

How to extend the RadAsyncUpload handler

5 Answers, 1 is accepted