Image selector via List Box populated from Database?

08-18-2004

I am hoping a mixed ASP- Javascript programmer could help me with this
scenario:

I have a list box populated with randomized records (NewID()) from a Broker
(Salesperson) sql server table.

Each time the user selects one of the broker items I need to display a Image
of the broker in the table cell next to it.

I have found a number of online js scripts that use the image selector route
but I am unable to work out to populate the list
item from the database AND at the same time utilize the JS...

Are there any coders who come across a solution like this. Here is an
example of my ASP code populating the List box:

Set oCmd = GetStoredProcedure(oConn,"spr_GetBroker")
set oRS = oCmd.execute()
Response.write ("<TR><TD class=text><strong>Broker:</strong></TD><TD>")
Response.write "<select name='u_BrokerID' size='4'
onChange='generateimage(this.options[this.selectedIndex].value)'>"
'//Response.Write("<TR><TD
class=text><strong>Broker:</strong></TD><TD><SELECT NAME=u_BrokerID>")
If oRS.eof then
Response.Write("<option>No records found for Nation</option>")
else
while not oRS.eof
Response.Write("<OPTION VALUE=""" & oRS.fields(0) & """>" &
oRS.fields(1) & "</OPTION>")
oRS.movenext
wend
End If

Response.Write("</SELECT>")

I now need to load the images (from the imagePath inside my database ie
rs(3)) and then trigger an event to launch a new image
in the next table cell...

Appreciate any advice!!!

- Jason

08-19-2004

<> wrote in message
news:%...
:I am hoping a mixed ASP- Javascript programmer could help me with this
: scenario:
:
: I have a list box populated with randomized records (NewID()) from a
Broker
: (Salesperson) sql server table.
:
: Each time the user selects one of the broker items I need to display a
Image
: of the broker in the table cell next to it.
:
: I have found a number of online js scripts that use the image selector
route
: but I am unable to work out to populate the list
: item from the database AND at the same time utilize the JS...
:
: Are there any coders who come across a solution like this. Here is an
: example of my ASP code populating the List box:
:
: Set oCmd = GetStoredProcedure(oConn,"spr_GetBroker")
: set oRS = oCmd.execute()
: Response.write ("<TR><TD class=text><strong>Broker:</strong></TD><TD>")
: Response.write "<select name='u_BrokerID' size='4'
: onChange='generateimage(this.options[this.selectedIndex].value)'>"
: '//Response.Write("<TR><TD
: class=text><strong>Broker:</strong></TD><TD><SELECT NAME=u_BrokerID>")
: If oRS.eof then
: Response.Write("<option>No records found for Nation</option>")
: else
: while not oRS.eof
: Response.Write("<OPTION VALUE=""" & oRS.fields(0) & """>" &
: oRS.fields(1) & "</OPTION>")
: oRS.movenext
: wend
: End If
:
: Response.Write("</SELECT>")
:
: I now need to load the images (from the imagePath inside my database ie
: rs(3)) and then trigger an event to launch a new image
: in the next table cell...
:
: Appreciate any advice!!!

Maybe this will help you get started...untested

sub prt(str)
response.write(str & vbCrLf)
end sub

Set oCmd = GetStoredProcedure(oConn,"spr_GetBroker")
set oRS = oCmd.execute()

prt("<html>")
ptr("<head><title></title>")
prt("<script type=""text/javascript"">")
prt("function generateimage(x) {")
prt(" document.getElementById('brokerimage').src = ""/images/" + x +
".jpg"";")
prt(" }")
prt("</script>")
prt("</head>")
prt("<body>")
prt("<table>")
prt("<tr colspan=2><td class=text><b>Broker:</b></td><tr>")
prt("<tr><td>
prt("<select name=""u_BrokerID"" size=""4""
onChange=""generateimage(this.options[this.selectedIndex].value)"">")
If oRS.eof then
prt("<div>No records found for Nation</div>")
else
do while not oRS.eof
prt("<option value=""" & oRS.fields(0).value & """>" &
oRS.fields(1).value & "</option>")
oRS.movenext
loop
End If
prt("</select></td>")
prt("<td><img id="brokerimage" name="brokerimage" src="""" /></td>")
prt("</table>")
prt("</body>")
prt("</html>")

set oRS = nothing
set oCmd = nothing

--
Roland Hall
/* This information is distributed in the hope that it will be useful, but
without any warranty; without even the implied warranty of merchantability
or fitness for a particular purpose. */
Technet Script Center - http://www.microsoft.com/technet/scriptcenter/
WSH 5.6 Documentation - http://msdn.microsoft.com/downloads/list/webdev.asp
MSDN Library - http://msdn.microsoft.com/library/default.asp

08-19-2004

Thanks Roland....I am amost got it to work but ran into an object errror...I
then switched direction and go this direction to work(below)...hope it helps
someone.

But now, I have a new dilemma. I have populated my <option value> with the
absolute url....

<option value="/catamaranco/images/brokers/christine_2.jpg">Christine
Buttigieg (sales)</option>

....which means my form processing page can no longer the expect the
"BrokerID" for insert into customer table.

I realise I could concantenate the id like this in the option: "option
value=35_="/catamaranco/images/brokers/christine_2.jpg"

But, then I have to use messy string manipulation on the next page or some
kind of function.

Is there a more elegant way to handle this which will not create problems
for me later on....

Many thanks for you post which got me on the right track.

- Jason

!-- #include virtual="/join/utility.asp" -->
<%
Dim oCmd, oReturn, oConn
set oConn = GetConnection()
Set oCmd = GetStoredProcedure(oConn,"sp_adduser1")
Set oCmd = GetStoredProcedure(oConn,"spr_GetBroker")
set oRS = oCmd.execute()
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<script language="javascript">

</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><form name="mygallery"><p>
<select name="picture" size="1" onChange="showimage()">
<%
If oRS.eof then
prt("<div>No records found for Nation</div>")
else
do while not oRS.eof
Response.write ("<option value=""" & oRS.fields(3).value & """>" &
oRS.fields(1).value & "</option>")

oRS.movenext
loop
End If
%>
</form>
</td>
</tr>
<tr>
<td width="100%"><p align="center"><img
src="/catamaranco/images/brokers/michaelharris_2.jpg" name="pictures"
width="99"
height="100"></td>
</tr>
</table>
</body>
</html>

"Roland Hall" <nobody@nowhere> wrote in message
news:...
> <> wrote in message
> news:%...
> :I am hoping a mixed ASP- Javascript programmer could help me with this
> : scenario:
> :
> : I have a list box populated with randomized records (NewID()) from a
> Broker
> : (Salesperson) sql server table.
> :
> : Each time the user selects one of the broker items I need to display a
> Image
> : of the broker in the table cell next to it.
> :
> : I have found a number of online js scripts that use the image selector
> route
> : but I am unable to work out to populate the list
> : item from the database AND at the same time utilize the JS...
> :
> : Are there any coders who come across a solution like this. Here is an
> : example of my ASP code populating the List box:
> :
> : Set oCmd = GetStoredProcedure(oConn,"spr_GetBroker")
> : set oRS = oCmd.execute()
> : Response.write ("<TR><TD
class=text><strong>Broker:</strong></TD><TD>")
> : Response.write "<select name='u_BrokerID' size='4'
> : onChange='generateimage(this.options[this.selectedIndex].value)'>"
> : '//Response.Write("<TR><TD
> : class=text><strong>Broker:</strong></TD><TD><SELECT NAME=u_BrokerID>")
> : If oRS.eof then
> : Response.Write("<option>No records found for Nation</option>")
> : else
> : while not oRS.eof
> : Response.Write("<OPTION VALUE=""" & oRS.fields(0) & """>" &
> : oRS.fields(1) & "</OPTION>")
> : oRS.movenext
> : wend
> : End If
> :
> : Response.Write("</SELECT>")
> :
> : I now need to load the images (from the imagePath inside my database ie
> : rs(3)) and then trigger an event to launch a new image
> : in the next table cell...
> :
> : Appreciate any advice!!!
>
> Maybe this will help you get started...untested
>
> sub prt(str)
> response.write(str & vbCrLf)
> end sub
>
> Set oCmd = GetStoredProcedure(oConn,"spr_GetBroker")
> set oRS = oCmd.execute()
>
> prt("<html>")
> ptr("<head><title></title>")
> prt("<script type=""text/javascript"">")
> prt("function generateimage(x) {")
> prt(" document.getElementById('brokerimage').src = ""/images/" + x +
> ".jpg"";")
> prt(" }")
> prt("</script>")
> prt("</head>")
> prt("<body>")
> prt("<table>")
> prt("<tr colspan=2><td class=text><b>Broker:</b></td><tr>")
> prt("<tr><td>
> prt("<select name=""u_BrokerID"" size=""4""
> onChange=""generateimage(this.options[this.selectedIndex].value)"">")
> If oRS.eof then
> prt("<div>No records found for Nation</div>")
> else
> do while not oRS.eof
> prt("<option value=""" & oRS.fields(0).value & """>" &
> oRS.fields(1).value & "</option>")
> oRS.movenext
> loop
> End If
> prt("</select></td>")
> prt("<td><img id="brokerimage" name="brokerimage" src="""" /></td>")
> prt("</table>")
> prt("</body>")
> prt("</html>")
>
> set oRS = nothing
> set oCmd = nothing
>
>
> --
> Roland Hall
> /* This information is distributed in the hope that it will be useful, but
> without any warranty; without even the implied warranty of merchantability
> or fitness for a particular purpose. */
> Technet Script Center - http://www.microsoft.com/technet/scriptcenter/
> WSH 5.6 Documentation -
http://msdn.microsoft.com/downloads/list/webdev.asp
> MSDN Library - http://msdn.microsoft.com/library/default.asp
>
>

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
div box questions; float text around a box, fit box to image size	Gnarlodious	HTML	4	05-05-2010 11:30 AM
List Box Populated Client Side	math.kiran@gmail.com	ASP .Net	4	12-27-2005 09:23 AM
Multi list box selector and post back question	Brian Henry	ASP .Net	3	08-18-2004 11:31 PM
Codebehind unaware of select box members populated via javascript	Allan M.	ASP .Net	5	12-11-2003 04:40 PM
Different user input boxes are automatically populated based on a value of the dropdown box.	reneeccwest	Javascript	2	07-11-2003 11:35 PM