Reading from list box and output to a img scr

@wholein1May 12.2010

Hello,
I am new to Javascript programming, I do know enough to modify certain parts of Javascript coding. I am trying to read a list box line by line and place the item into an image link. I am trying to loop throught the list box and write out the item to the link and also write out the count which is “i” to be the array number, if that make sense. Here is what I have so far. I am not sure what I am missing to get this done.

var i = 0

var listbox

var image

function listbox_selectall() {

do while i < listbox.count

listbox = document.getElementById(lstFileHidden); image = form.list.options[listbox].text;

// for (var count = 0; i < listbox.options.length; i++) {
// listbox.options~~[i]~~.selected = isSelect;
i+=1
leftrightslide~~[i]~~ = ‘<img src=”content/Small Photos/images/’+ image'” width = “240” height = “161” class = “boarder” border=1></a>’
}

Thanks for you help

Jeff

to post a comment

JavaScript

3 Comments(s) _↴

@NicTltMay 12.2010 — #Oh dear, there's not a line there that doesn't have an error in it :o

Can you show us the relevant HTML so we can be sure?

@wholein1authorMay 12.2010 — #<asp:ListBox ID="lstFileHidden" runat="server" Visible="True"></asp:ListBox>

 <script type="text/javascript">
 
 
 
 
   //Specify the slider's width (in pixels)
   var sliderwidth = "729px"
   //Specify the slider's height
   var sliderheight = "175px"
   //Specify the slider's slide speed (larger is faster 1-10)
   var slidespeed = 1
   //configure background color:
   slidebgcolor = "#0071B5"
 
   //Specify the slider's images
 
 
   var leftrightslide = new Array()
   //           var finalslide = ''
   function loop() {
   var list = document.getElementById('lstFileHidden');
   for (var i = 0; i < list.options.length; ++i) alert(list.options[i].value);

}

//var i = 0

//var listbox

//var image

//function listbox_selectall() {

//do while i < listbox.count

// listbox = document.getElementById(lstFileHidden)

// image = form.list.options[listbox].text

//// for (var count = 0; i < listbox.options.length; i++) {

//// listbox.options[i].selected = isSelect;

// i+=1

// leftrightslide[i] = '<img src="content/Small Photos/images/'image'" width = "240" height = "161" class = "boarder" border=1></a>'

// }

// leftrightslide[0] = '<img src="content/Small Photos/images/leader-0006.jpg" width = "240" height = "161" class = "boarder" border=1></a>'

//// leftrightslide[1] = '<img src="content/Small Photos/" width = "240" height = "161" class = "boarder" border=1></a>'

// leftrightslide[2] = '<img src="content/Small Photos/leader-0008.jpg" width = "240" height = "161" class = "boarder" border=1></a>'

// leftrightslide[3] = '<img src="content/Small Photos/leader-0011.jpg" width = "240" height = "161" class = "boarder" border=1></a>'

// leftrightslide[4] = '<img src="content/Small Photos/leader-0014.jpg" width = "240" height = "161" class = "boarder" border=1></a>'

// leftrightslide[5] = '< href = "content/Small Photos/content.asp" ></a>'

// img src="content/Small Photos/leader-0014.jpg"

//Specify gap between each image (use HTML):

var imagegap = " "

 //Specify pixels gap between each slideshow rotation (use integer):
   var slideshowgap = 4
 
 
   ////NO NEED TO EDIT BELOW THIS LINE////////////
 
   var copyspeed = slidespeed
   leftrightslide = '<nobr>' + leftrightslide.join(imagegap) + '</nobr>'
   var iedom = document.all || document.getElementById
   if (iedom)
   document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">' + leftrightslide + '</span>')
   var actualwidth = ''
   var cross_slide, ns_slide
 
   function fillup() {
   if (iedom) {
   cross_slide = document.getElementById ? document.getElementById("test2") : document.all.test2
   cross_slide2 = document.getElementById ? document.getElementById("test3") : document.all.test3
   cross_slide.innerHTML = cross_slide2.innerHTML = leftrightslide
   actualwidth = document.all ? cross_slide.offsetWidth : document.getElementById("temp").offsetWidth
   cross_slide2.style.left = actualwidth + slideshowgap + "px"
   }
   else if (document.layers) {
   ns_slide = document.ns_slidemenu.document.ns_slidemenu2
   ns_slide2 = document.ns_slidemenu.document.ns_slidemenu3
   ns_slide.document.write(leftrightslide)
   ns_slide.document.close()
   actualwidth = ns_slide.document.width
   ns_slide2.left = actualwidth + slideshowgap
   ns_slide2.document.write(leftrightslide)
   ns_slide2.document.close()
   }
   lefttime = setInterval("slideleft()", 30)
   }
   window.onload = fillup
 
   function slideleft() {
   if (iedom) {
   if (parseInt(cross_slide.style.left) > (actualwidth * (-1) + 8))
   cross_slide.style.left = parseInt(cross_slide.style.left) - copyspeed + "px"
   else
   cross_slide.style.left = parseInt(cross_slide2.style.left) + actualwidth + slideshowgap + "px"
 
   if (parseInt(cross_slide2.style.left) > (actualwidth * (-1) + 8))
   cross_slide2.style.left = parseInt(cross_slide2.style.left) - copyspeed + "px"
   else
   cross_slide2.style.left = parseInt(cross_slide.style.left) + actualwidth + slideshowgap + "px"
 
   }
   else if (document.layers) {
   if (ns_slide.left > (actualwidth * (-1) + 8))
   ns_slide.left -= copyspeed
   else
   ns_slide.left = ns_slide2.left + actualwidth + slideshowgap
 
   if (ns_slide2.left > (actualwidth * (-1) + 8))
   ns_slide2.left -= copyspeed
   else
   ns_slide2.left = ns_slide.left + actualwidth + slideshowgap
   }
   }
 
 
   if (iedom || document.layers) {
   with (document) {
   document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
   if (iedom) {
   write('<div style="position:relative;width:' + sliderwidth + ';height:' + sliderheight + ';overflow:hidden">')
   write('<div style="position:absolute;width:' + sliderwidth + ';height:' + sliderheight + ';background-color:' + slidebgcolor + '" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')
   write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
   write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
   write('</div></div>')
   }
   else if (document.layers) {
   write('<ilayer width=' + sliderwidth + ' height=' + sliderheight + ' name="ns_slidemenu" bgColor=' + slidebgcolor + '>')
   write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
   write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
   write('</ilayer>')
   }
   document.write('</td></table>')
   }
   }

</script>

@NicTltMay 12.2010 — #I'm assuming the ASP ListBox renders as a SELECT with OPTIONS?

[CODE]
 function listbox_selectall() { 
 var listbox  = document.getElementById("lstFileHidden");
 for (var i = 0, opt; opt = listbox.options[i]; i++) {
 leftrightslide[i] = '<img src="content/Small Photos/images/'+ opt.text + '" width = "240" height = "161" class = "boarder" border=1></img>'
 }
 }
 [/CODE]

Hopefully this should get you going - there are more things that you could tidy up (not combining classes and inline styles and avoiding global variables, for instance) but let's get this working before we get fancy.

I haven't had a close look at the rest of the code but it does look like IE-specific JScript from about 2002, so it may still be broken.

Also in #JavaScript _↴

making values from forms into global JS variables javascript select divs How do I get absolutely EVERY DOM elements in an array?

Success!

Help @wholein1 spread the word by sharing this article on Twitter...

Tweet This

Reading from list box and output to a img scr

3 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Reading from list box and output to a img scr

3 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

3 Comments(s) _↴

Also in #JavaScript _↴