Questions on UI for ASP.NET AJAX Forum

1 answer

172 views

Based on the documentation I've seen, the Avatar control is looking for a url for the image. Is there a way to display a binary image from a sql datasource instead?

Avatar

BinaryImage

answered on 02 Feb 2024

1 answer

232 views

RadBinaryImage ASP.NET AJAX

I've been trying to display a System.Drawing.Image (obtained from live camera feed snapshot) dynamically in a DataList control with asp:Image control but not having any success.

I was looking at RadBinaryImage to see if this is a viable option.

The images to be displayed are variable (aka dynamic number of images not static number/count) so I may have 5 images or 10 images or 7 images that are all System.Drawing.Image types. I want to display those images in a Grid or DataList.

    <asp:DataList ID="cameras" runat="server" RepeatColumns="3" RepeatDirection="Horizontal" RepeatLayout="Table">
        <ItemTemplate>
            <asp:Image ID="cameraX" runat="server" />
        </ItemTemplate>
    </asp:DataList>

In the ItemDataBound event handler I convert to byte array and assign to asp:Image ImageUrl ... but this results in nothing being displayed. No errors, just nothing displayed. Would RadBinaryImage be a solution?

        protected void cameras_ItemDataBound(object sender, System.Web.UI.WebControls.DataListItemEventArgs e)
        {
            
            Models.Facility.Camera camera = e.Item.DataItem as Models.Facility.Camera;
            Image img = GetImage(camera);
            MemoryStream ms = new MemoryStream();
            img.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);
            System.Web.UI.WebControls.Image imgControl = (System.Web.UI.WebControls.Image)e.Item.FindControl("camera");
            var base64Data = Convert.ToBase64String(ms.ToArray());
            imgControl.ImageUrl = "data:image/jpg;base64," + base64Data;

        }

Cheers, Rob.

BinaryImage

Grid

UI for ASP.NET AJAX in ASP.NET MVC

answered on 17 Jan 2023

1 answer

457 views

How to add a download button for image stored in GridBinaryImageColumn

I have a RadGrid that displays some images from a database. I'm trying to add a button to the grid that allows the user to download the image using the original file name and extension saved in the ImageName column.

<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSourceImageUpload" OnItemCommand="RadGrid1_ItemCommand">
  <MasterTableView DataKeyNames="ImageID" DataSourceID="SqlDataSourceImageUpload" >
                            <Columns>
                                <telerik:GridButtonColumn ButtonType="ImageButton" CommandName="download_file" UniqueName="download" ></telerik:GridButtonColumn>
                                <telerik:GridBoundColumn DataField="ImageName" UniqueName="ImageName" ></telerik:GridBoundColumn>
                                <telerik:GridBinaryImageColumn DataField="ImageData" ></telerik:GridBinaryImageColumn>
                            </Columns>
                        </MasterTableView>

                <asp:SqlDataSource ID="SqlDataSourceImageUpload" runat="server"
                                   ConnectionString="<%$ ConnectionStrings:123ConnectionString %>" 
                                   SelectCommand="SELECT * FROM [tbl_Images]" 
                                   DeleteCommand="DELETE FROM [tbl_Images] WHERE [ImageID] = @ImageID" 
                                   InsertCommand="INSERT INTO [tbl_Images] ([ImageData], [ImageName], [Text]) 
                                   VALUES (@ImageData, @ImageName, @Text)" 
                                   UpdateCommand="UPDATE [tbl_Images] SET [Text] = @Text WHERE [ImageID] = @ImageID">
                    <DeleteParameters>
                        <asp:Parameter Name="ImageID" Type="Int32" />
                    </DeleteParameters>
                    <InsertParameters>
                        <asp:QueryStringParameter Name="IncidentID" QueryStringField="ID" Type="String" />
                        <asp:Parameter Name="Text" Type="String" />
                    </InsertParameters>
                    <UpdateParameters>
                        <asp:Parameter Name="Text" Type="String" />
                        <asp:Parameter Name="ImageID" Type="Int32" />
                    </UpdateParameters>
                </asp:SqlDataSource>

I found this code online, and honestly not sure how to make it all work with what I'm trying to do. I really feel like I'm over complicating this whole thing. Is there an easy button I'm missing somewhere?

The ultimate goal is for the user to click a download button and have the image download using the ImageName field as the file name.

    Protected Sub RadGrid1_ItemCommand(sender As Object, e As GridCommandEventArgs)
        If e.CommandName = "download_file" Then
            Dim ditem As GridDataItem = CType(e.Item, GridDataItem)
            Dim filename As String = ditem("ImageName").Text
            Dim path As String = MapPath("/sample/" & filename)
            Dim bts As Byte() = System.IO.File.ReadAllBytes(path)
            Response.Clear()
            Response.ClearHeaders()
            Response.AddHeader("Content-Type", "Application/octet-stream")
            Response.AddHeader("Content-Length", bts.Length.ToString())
            Response.AddHeader("Content-Disposition", "attachment; filename=" & filename)
            Response.BinaryWrite(bts)
            Response.Flush()
            Response.[End]()
        End If
    End Sub

BinaryImage

Grid

answered on 05 Oct 2022

1 answer

169 views

RadBinaryImage as CSS background-image?

Is there a recommended way to use the RadBinaryImage control to serve an image via CSS?

Ideally, I would like to replace a line like this:

background-image: url("mybackground.gif");

with something like this:

background-image: url("<%=  RadBinaryImage1.UrlTheBrowserRequests %>");

<telerik:RadBinaryImage ID="RadBinaryImage1" runat="server"  />

...but as far as I can tell, the serving url not exposed. Is the url is deterministic enough to recreate?

I'm open to alternatives, too. The best I've come up with so far is styling the image as a relatively positioned layer, but there are significant complexities and limitations to that approach, and any explicit sizing plays poorly with the serverside size that get rendered by the control.

Thanks,

Phil

BinaryImage

answered on 06 Jun 2022

1 answer

122 views

Compile errors: 2 Upgrades and errors of The type or namespace name 'Telerik' could not be found

I did the two latest upgrades and I cannot compile my project now. Every Telerik reference gives "The type or namespace name 'Telerik' could not be found"

I am always nervous when I do Telerik upgrades.

I emptied the licenses.licx file, which is frequently the problem.

In the Webconfig

The version is now 2022.1.19.45. Why does the upgrade not set the correct settings?

Should it be

like all the other dependenticies?

This change gives the same errors. I assume the publicKeyToken is unchanged.

BinaryImage

General Discussions

Installer and VS Extensions

answered on 14 Feb 2022

1 answer

254 views

RadBinaryImage in template - trying to handle NULL values

I have a RadBinaryImage in a RadGrid template column and I'm trying to account for situations where the value is null. In reviewing some of the posts, I saw the following solution.

<telerik:RadBinaryImage runat="server" ID="RadBinaryImage2" DataValue='<%# Eval("vSignature") Is DBNull ? null  Eval("vSignature") %>' AutoAdjustImageControlSize="false" Height="100px" Width="400px" ToolTip="Signature" AlternateText="Signature" />

However, I get a design-time error stating that...

DBNull is a class type and cannot be used as an expression.

I have seen examples of this, but this does not work for me in Visual Studio 2017, Asp.Net 4.6.

Any help on this is greatly appreciated!

BinaryImage

Grid

answered on 13 Aug 2021

1 answer

123 views

Default Value in RadListView

Hi Guys,

I need to generate a default value for a BinaryImage (in a RadListView) when the image source from the database is NULL.

This is the BinaryImage code in RadListView

<asp:PlaceHolder ID="badgeContainer" runat="server"></asp:PlaceHolder>

</LayoutTemplate>

<ItemTemplate>

<asp:LinkButton ID="lb1" runat="server" CommandName="content" CommandArgument='<%#Eval("bid") %>'>

<telerik:RadBinaryImage ID="rbImageBadge" runat="server" DataValue='<%# IIf(Eval("badge") IsNot DBNull.Value, Eval("badge"), New System.Byte(-1) {})%>'

AutoAdjustImageControlSize="false" Width="120px" Height="120px" ToolTip='<%#Eval("badgetitle", "{0}") %>'

AlternateText='<%#Eval("badgetitle", "{0}") %>' />

</asp:LinkButton>

''''''''''''''''''''''' etc

I have tried everything that I have read but just cannot get it to show a default image.
All help appreciated!

My Handler is

Imports System.Data.SqlClient

Public Class badgeImage : Implements IHttpHandler

Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest

Dim conn As SqlConnection = Nothing

conn = New SqlConnection(ConfigurationManager.ConnectionStrings("jbdata").ConnectionString)

context.Response.ContentType = "image/png"

Dim id As Integer = Convert.ToInt32(context.Request.QueryString("ID"))

Dim cmdText As String = "select badge from badges where bid=" & id

Dim command As New SqlCommand(cmdText, conn)

conn.Open()

Dim reader As SqlDataReader = command.ExecuteReader()

reader.Read()

If id > 0 Then

Dim image As Byte() = DirectCast(reader(0), Byte())

context.Response.BinaryWrite(image)

Else

Dim location As String = System.Web.HttpContext.Current.Server.MapPath("~/badgz/images/default.png")

System.Web.HttpContext.Current.Response.WriteFile(location)

End If

reader.Close()

conn.Close()

End Sub

Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable

Get

Return False

End Get

End Property

End Class

BinaryImage

answered on 14 Aug 2020

1 answer

649 views

'Fit' ResizeMode stretches the image.

Having a bit of trouble with the resize mode on the BinaryImage. I have specified the Width and Height in the aspx attributes and set the ResizeMode to fit, however it's just setting every image to the sizes that I specified rather than fitting them as it should be. This results in images being stretched rather than fit as if it's actually set to fill instead.

I'm using an httphandler to serve the image from a database and this is the relevant code:

Is there something that I'm missing here? Simply setting the ResizeMode to fit and setting a max height and width should be enough, right?

<asp:Panel runat="server" Style="text-align:center;" >

<telerik:RadBinaryImage runat="server" ID="imgStu" ResizeMode="Fit" Width="1050" Height="700" />

</asp:Panel>

imgStu.ImageUrl = "~/frm/ShowImage.ashx?id=" + strImageID;

BinaryImage

answered on 08 Oct 2019

1 answer

177 views

How can represent binary data as svg in kendo grid MVC?

I would like to represent binary data that save in myTable in sqlserver as svg in kendo grid MVC

BinaryImage

answered on 16 Sep 2019

13 answers

107 views

Totally stuck! Need assistance, please.

I'm new to Telerik and am having trouble trying to write the correct code to do the following scenario.

I have a SQL Server 2008 as backend. Here is the scenario. A new employee needs to have her photo taken and added to a webpage. The photo is not committed to the database until the Save button is pressed.

I need to present a default image in a "new employee" entry screen. A button is pressed to popup the image capture. The image is saved to a work table in the database (WRK_PHOTO). I need to now take the image from WRK_PHOTO and replace the default image on the page. Once the save button is pressed, the new image is saved to the database in the EMPLOYEE table.

I have the whole web cam capture and save to WRK_PHOTO in place and working.

What I don't have is the display of the temporary default image on the screen, and replacing it with the newly captured photo stored in WRK_PHOTO. Also, I don't know how to save the new image to the EMPLOYEE table when the save button is pressed.

I attached a .PNG graphic image of what I'm looking to do. The capture of the webcam is done. I just to know how to handle the interaction with the Telerik image control.

BinaryImage

answered on 06 Mar 2019