ok i got it..after a week lol....how can i now make it so i can have
more than one list box...
<script type="text/javascript">
$(document).ready(function(){
$('#MyImage').bind('change', function() {
var update_pic = $(this).val();
if (update_pic) {
$('#NewPic').attr('src', 'indices/icons/' + update_pic +
'' );
}
});
});
</script>
<select id="MyImage">
<option selected="selected"> </option>
<option value="image.png">image.png</option>
<option value="java.png">java.png</option>
<option value="js.png">java.png</option>
</select>
<img id="NewPic" src="#" alt="" />
On Jan 19, 3:32 pm, dfwcomputer <[email protected]> wrote:
> I feel close yet so far away lol
>
> I can get it to display the image path but how do I update the img
> src
>
> any ideas?
>
> <!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"; xml:lang="en" lang="en">
> <head><title></title>
>
> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/
> libs/jquery/1.2.6/jquery.min.js"></script>
>
> <script type="text/javascript" src="http://texotela.appspot.com/js/
> plugins/jquery.selectboxes.js"></script>
> <script type="text/javascript" src="http://www.texotela.co.uk/js/
> parsesamples.js"></script>
> <script type="text/javascript">
> $(document).ready(
> function()
> {
> parseSamples();
> $("#debug").hide();
> $("select").change(
> function()
> {
> $("#debug").show();
>
> $("#debug").html("images/icons/" + this.value + "'");
> }
> );
> }
> )
> </script>
> </head>
> <body>
> <form id="example" action="javascript:void()">
> <p><select name="myselect" id="myselect">
> <option value="java.png">#myselect option 1</option>
> <option value="js.png">#myselect option 2</option>
> </select></p>
> <p>My Select 2:</p>
>
> <div id="debug">
> <img src="indices/icons/php.png" alt="" />
> </div>
> </form>
> </body>
> </html>
>
> On Jan 18, 3:08 pm, dfwcomputer <[email protected]> wrote:
>
> > Im sure this is probably very simple...like me :(
>
> > I have been searching for hours now without any results
>
> > I have a list box which displays an image when you select it all i
> > want to do is update it to use jquery and also make it so i can use
> > multiple list box's as currently anymore than one list box stops them
> > all from working...I think it needs to be selector based?
>
> > Here is the current code Im using
>
> > <!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>Dynamic Update</title>
> > <script language="javaScript" type="text/javascript">
> > //<![CDATA[
> > function update_picture(newimage) {
> > document.picture_image.src = "images/icons/" + newimage;
> > }
> > //]]>
> > </script>
> > </head>
> > <body>Images:
> > <select name="newpicture" onchange="update_picture(this.options
> > [selectedIndex].value);">
> > <option selected="selected">Select Image</option>
> > <option value="arrow-down.png">arrow-down.png</option>
> > <option value="arrow-up.png">arrow-up.png</option>
> > <option value="back.png">back.png</option>
> > <option value="blank.gif">blank.gif</option>
> > </select>
> > <img src="images/icons/default.png" alt="" name="pic_image"
> > border="0" id="picture_image" />
> > </body>
> > </html>
