Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

How can I use slidecontrol extender with sql image data

Posted on 2012-04-04
18
Medium Priority
?
662 Views
Last Modified: 2012-04-24
I have retreived a few images from a sql table.  I want to be able to add each image in the dataset to a image control, with slideshow extender.  So I want to fill the extender with images from the sql table and show them.  Of course I can retrieve the images from sql, but how do I take those binary files and convert them and add them as images to the image control.

thanks
0
Comment
Question by:mgmhicks
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 9
18 Comments
 
LVL 96

Expert Comment

by:Bob Learned
ID: 37812754
Have you started to work with the SlideShowExtender yet?  Have you configured a web service to get the slides?

SlideShow Demonstration
http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/SlideShow/SlideShow.aspx

[System.Web.Services.WebMethod]
    [System.Web.Script.Services.ScriptMethod]
    public AjaxControlToolkit.Slide[] GetSlides() { ... }

Open in new window

0
 

Author Comment

by:mgmhicks
ID: 37812780
yes, I have.  So inside the webservice I need to get the data?  What about attaching multiple images to the image control from sql table?
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 37812804
This is a great question, because I have only ever used static images for the slide show, as shown in this example:

http://www.asp.net/ajaxlibrary/HOW%20TO%20Use%20the%20SlideShow%20Control.ashx 

[System.Web.Services.WebMethod]  
    [System.Web.Script.Services.ScriptMethod]  
    public static AjaxControlToolkit.Slide[] GetImages()  
    {  
        return new AjaxControlToolkit.Slide[] {   
        new AjaxControlToolkit.Slide("images/Blue hills.jpg", "Blue Hills", "Go Blue"),  
        new AjaxControlToolkit.Slide("images/Sunset.jpg", "Sunset", "Setting sun"),  
        new AjaxControlToolkit.Slide("images/Winter.jpg", "Winter", "Wintery..."),  
        new AjaxControlToolkit.Slide("images/Water lilies.jpg", "Water lillies", "Lillies in the water"),  
        new AjaxControlToolkit.Slide("images/VerticalPicture.jpg", "Sedona", "Portrait style picture")};  
    }  

Open in new window

0
Docker-Compose to Simplify Multi-Container Builds

Our veteran DevOps Author takes you through how to build a multi-container environment, managed with a single utility in order to simplify your deployments.

 
LVL 96

Expert Comment

by:Bob Learned
ID: 37812826
Here is a thought--use an HttpHandler, and modify the Slide constructor to take the .ashx handler as an argument.

Ajax Slide Show - Get Images from Database
http://stackoverflow.com/questions/2506536/ajax-slide-show-get-images-from-database
0
 

Author Comment

by:mgmhicks
ID: 37812828
Yea, thats easier, but my images are all in sql table.  Saw something about creating my own hhtp handler.  Also saw this http://aspsnippets.com/Articles/Save-and-Retrieve-Files-from-SQL-Server-Database-using-ASP.Net.aspx

but not sure how to implement to image controls and using slider extender.
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 37812849
The SlideShowExtender generates <img> elements in the page, so I am trying to figure out why you would need an Image control?
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 37812852
D'oh, that is control for the TargetControlID...
0
 

Author Comment

by:mgmhicks
ID: 37824526
ok, here is what I have so far, create the handler and retrieve the files.  Could be up to 3 images returned.

Now upon retrievel how am I assign to slideshow control?


Imports System.Web
Imports System.Web.Services
Imports System.IO
Imports System.Data
Imports System.Data.SqlClient


Public Class GetImages
    Implements System.Web.IHttpHandler
    Private Const myConnStr As String = "SERVER=10.10.10.44,8433;Database=AptGallery;uid=sa;pwd=sh4207"
    Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
        Dim mID As Integer = 0

        Try

            If IsDBNull(context.Request.QueryString("ID")) Then
                Throw New ArgumentException("No parameter specified")
            Else
                mID = CInt(context.Request.QueryString("ID"))
                Dim ds As New DataSet
                Dim da As New SqlDataAdapter
                Dim myCMD As New SqlCommand
                Dim myCon As New SqlConnection(myConnStr)
                With myCMD
                    .Connection = myCon
                    .CommandType = CommandType.Text
                    .CommandText = "Select * from ReviewPictures where reViewID = " & mID
                End With
                da.SelectCommand = myCMD
                myCon.Open()
                da.Fill(ds)
                myCon.Close()


            End If


        Catch ex As Exception


        End Try


    End Sub

    ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
        Get
            Return False
        End Get
    End Property

End Class
0
 
LVL 96

Accepted Solution

by:
Bob Learned earned 2000 total points
ID: 37824805
You need to generate a URL for the image control that is processed by the HttpHandler, as shown in this example:

http://forums.asp.net/t/1555470.aspx

~/Handlers/ImageHandler.ashx?Mod1119="+Username, "Blue Hills", "Go Blue")

[System.Web.Services.WebMethod] 
    [System.Web.Script.Services.ScriptMethod] 
    

    public static AjaxControlToolkit.Slide[] GetSlides() 
    { 
        string Username = (HttpContext.Current.Request.QueryString["Username"]); 
        return new AjaxControlToolkit.Slide[] 
        { 
        new AjaxControlToolkit.Slide("~/Handlers/ImageHandler.ashx?Mod1119="+Username, "Blue Hills", "Go Blue"),

        new AjaxControlToolkit.Slide("Ximage/2.jpg", "Sunset", "Setting sun"), 
        new AjaxControlToolkit.Slide("XImage/3.jpg", "Winter", "Wintery...") 
        };             
    }

Open in new window


The query string parameters in the URL should match up to the code in the HttpHandler where you use Request.QueryString values.
0
 

Author Comment

by:mgmhicks
ID: 37824821
how do I call the handler from the page i will be getting the id from.  So I have it where on a page a client clicks the picture link, that I have in a grid box, which I then get the ID of the pictures I am looking for.  So now how do I call handler and  do I have to convert  the image data from sql to another format?
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 37825086
You need to return an image in the response from the HttpHandler, and then use the URL in the Web Method call to build the Slide array.

The constructor for the Slide object takes arguments as in this example:

AjaxControlToolkit.Slide("images/Blue hills.jpg", "Blue Hills", "Go Blue")

Open in new window


Change the URL to be one that references the HttpHandler, with an .ashx extension. and the query string arguments to get the correct image.
0
 

Author Comment

by:mgmhicks
ID: 37825321
ok, but if the ID I'm using returns 3 pictures.   Will the handler return them 1 at a time or all 3 at once.  Do I have to iriderate through them?
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 37825556
If you have 3 images with 1 ID, you need 3 Slide objects.  The HttpHandler can only return 1 image at a time.  The key, that I see, would be returning 1 image per each HttpHandler request.  You bind each of the responses, written to the output stream, to a URL.
0
 

Author Comment

by:mgmhicks
ID: 37825827
ok, I think we almost have it.  Here is my aspx file, amsx file and the ashx.  It gets to asmx file but doesnt seem to be hitting the ashx file, I have put a break point on it but it doesnt hit it, yet the amsx doesnt error out.  Any Ideas.  Thanks


ASPX file code behind:
Imports System.Data
Imports System.Data.SqlClient
Imports System.IO
Partial Public Class ViewPictures
    Inherits System.Web.UI.Page
    Dim myID As String
    Dim mVendorID As String
    Dim mVendorName As String
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        On Error GoTo Problem

        myID = Request.QueryString("ID")
        mVendorID = Request.QueryString("VendorID")
        mVendorName = Request.QueryString("VendorName")
        Image1_SlideShowExtender.ContextKey = myID

        Exit Sub
Problem:
        Dim test As String = Err.Description


    End Sub
   
End Class

ASPX html

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Companion.master" CodeBehind="ViewPictures.aspx.vb" Inherits="CrystalReportsTest.ViewPictures" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div>
   </div>
    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
    </asp:ToolkitScriptManager>
   <div>
   <p>
       <asp:Image ID="Image1" runat="server" />
       <asp:SlideShowExtender ID="Image1_SlideShowExtender" runat="server"
           Enabled="True" NextButtonID="btnNext" PlayButtonID="btnPlay"
           PlayButtonText="Play" PreviousButtonID="btnPrevious" SlideShowServicePath="SlideShow.asmx"
           StopButtonText="Stop" TargetControlID="Image1"
           SlideShowServiceMethod="GetPhotos">
       </asp:SlideShowExtender>
   </p>
   </div>
   <div>
       <asp:Button ID="btnPlay" runat="server" Text="Play" />
       <asp:Button ID="btnPrevious" runat="server" Text="Previous" />
       <asp:Button ID="btnStop" runat="server" Text="Stop" />
   </div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
</asp:Content>


ASMX file

Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.ComponentModel
Imports System.Web
Imports System.Data.SqlClient
Imports System.Data.Sql
Imports System.Data
' To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
<System.Web.Script.Services.ScriptService()> _
<System.Web.Services.WebService(Namespace:="http://tempuri.org/")> _
<System.Web.Services.WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
<ToolboxItem(False)> _
Public Class SlideShow1
    Inherits System.Web.Services.WebService

    <WebMethod()> _
    Public Function GetPhotos(ByVal contextKey As String) As AjaxControlToolkit.Slide()
        Dim photoReader As SqlDataReader
        Dim conn As SqlConnection = New SqlConnection
        Dim cmd As SqlCommand = New SqlCommand

        Try
            conn.ConnectionString = ConfigurationManager.ConnectionStrings("AptGallery").ConnectionString
            cmd.CommandType = CommandType.StoredProcedure
            cmd.Connection = conn
            cmd.CommandText = "MGM_GetPictureIDs"
            cmd.Parameters.Add("@ReviewID", SqlDbType.Int)
            cmd.Parameters("@ReviewID").Value = contextKey
            conn.Open()
            photoReader = cmd.ExecuteReader()

            Dim slides(24) As AjaxControlToolkit.Slide
            Dim i As Integer = 0
            While photoReader.Read
                slides(i) = New AjaxControlToolkit.Slide("SlideShowHandler.ashx?TypeID=1&PhotoID=" & photoReader("ID"), "test", "test")
                i += 1
            End While
            photoReader.Close()
            conn.Close()

            i -= 1
            ReDim Preserve slides(i)

            Return slides
        Catch ex As Exception
            Dim test As String = ex.Message

        End Try

    End Function


End Class

ASHX File

Imports System.Web
Imports System.Web.Services
Imports System.IO
Imports System.Data
Imports System.Data.SqlClient


Public Class GetImages
    Implements System.Web.IHttpHandler
    Private Const myConnStr As String = "SERVER=xx.xx.xx.xx,8433;Database=AptGallery;uid=sa;pwd=xxxxx"
    Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
        Dim sdsPhoto As SqlDataSource = New SqlDataSource
        sdsPhoto.ConnectionString = ConfigurationManager.ConnectionStrings("AptGallery").ConnectionString
        sdsPhoto.SelectCommand = "MGM_GetPhotos"
        sdsPhoto.SelectCommandType = SqlDataSourceCommandType.StoredProcedure
        sdsPhoto.SelectParameters.Add("@ID", context.Request.QueryString("PhotoID"))
        Dim dv As DataView = sdsPhoto.Select(DataSourceSelectArguments.Empty)
        Dim dr As DataRow
        Try
            dr = dv.Table.Rows(0)
        Catch
            context.Response.Write("No Image Found")
            Exit Sub
        End Try
        Dim arrImage() As Byte = CType(dr("Image1"), Byte())
        context.Response.BinaryWrite(arrImage)

    End Sub

    ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
        Get
            Return False
        End Get
    End Property

End Class
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 37825887
Did you register the HttpHandler in the web.config?  

How to: Register HTTP Handlers
http://msdn.microsoft.com/en-us/library/46c5ddfy.aspx
0
 

Author Comment

by:mgmhicks
ID: 37825994
this is the line I entered, and I am getting errors.  Probably not using correct syntax.  Can you help?

<add verb="*" path="SlideShowHandler.ashx" type="SlideShowHandler, SlideShowHandlerAssembly"/>

so close!!
0
 

Author Comment

by:mgmhicks
ID: 37826026
Keep getting could load type SlideShowHandler
0
 

Author Comment

by:mgmhicks
ID: 37826116
this is what I changed it to, and I still get can not load type SlideShowHandler.

<add verb="*" path ="/maintenance/ViewPictures.aspx" type="SlideShowHandler"/>
0

Featured Post

Stack Overflow Podcast - Developer Story

Welcome to the Stack Overflow podcast recorded Thursday July 20 at Stack Overflow Headquearters in NYC. Your hosts today are podcast regulars Jay Hanlon, David Fullerton, and Ilana Yitzhaki, plus the quite irregular Matt Sherman (Stack Overflow Engineering Manager extraordinaire)

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

jQuery is a JavaScript library that greatly simplifies JavaScript programming. AJAX is an acronym formed from "Asynchronous JavaScript and XML."  AJAX refers to any communication between client and server, when the human client does not observe a…
The most up-to-date version of this article is on my Blog https://iconoun.com/blog/
In this video, Percona Director of Solution Engineering Jon Tobin discusses the function and features of Percona Server for MongoDB. How Percona can help Percona can help you determine if Percona Server for MongoDB is the right solution for …
Want to learn how to record your desktop screen without having to use an outside camera. Click on this video and learn how to use the cool google extension called "Screencastify"! Step 1: Open a new google tab Step 2: Go to the left hand upper corn…

670 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question