Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Nov 2009
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Unhappy Double combo with image

    hi

    I wonder if someone out there can help me.

    I am very new to javascript and i have manged to understand a little of a double combo box with description however I would now like to be able to not only change the comment underneth but also add an image.
    This image (along with the comment) changes everytime the dropdownbox changes.
    I just cant seem to add the image.
    Please can anyone help
    I would really appreciate it and be extremely grateful.
    gr
    T

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,300
    Thanks
    203
    Thanked 2,561 Times in 2,539 Posts
    Show your (relevant) existing code.

  • #3
    New to the CF scene
    Join Date
    Nov 2009
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    apologies.... quite right.... would have been helpful to post the code
    please see below...

    <form name="doublecombo">
    <select name="event" size="1" onChange="redirect(this.options.selectedIndex); displaydesc()">
    <option>------ please select ------</option>
    <option>websites</option>
    <option>searchengines</option>
    </select>
    <select name="stage2" size="1" onchange="displaydesc()">
    <option value="">------ please select ------</option>
    </select>
    <input type="button" name="test" value="Go!"
    onClick="go()">
    <br />
    <span id="descriptions" align="left" style="font:13px Arial"></span>
    </form>
    <script>

    var groups=document.doublecombo.event.options.length
    var group=new Array(groups)
    var descr=new Array(groups)
    for (i=0; i<groups; i++){
    group[i]=new Array()
    descr[i]=new Array()
    }

    group[0][0]=new Option("","")
    descr[0][0]= "";

    group[1][0]=new Option("yahoo","http://www.yahoo.co.uk")
    descr[1][0]= "yahoo is best";
    group[1][1]=new Option("News.com","http://www.news.com")
    descr[1][1]= "news com gives up to date news";
    group[1][2]=new Option("Wired News","http://www.wired.com")
    descr[1][1]= "wired news is wired";

    group[2][0]=new Option("Hotbot","http://www.hotbot.com")
    descr[2][0]= "hot has a hot bot";
    group[2][1]=new Option("Infoseek","http://www.infoseek.com")
    descr[2][1]= "do you seek info?";
    group[2][2]=new Option("Excite","http://www.excite.com")
    descr[2][2]= "ahem...";
    var temp=document.doublecombo.stage2

    function redirect(x){
    for (m=temp.options.length-1;m>0;m--)
    temp.options[m]=null
    for (i=0;i<group[x].length;i++){
    temp.options[i]=new Option(group[x][i].text,group[x][i].value)
    }
    temp.options[0].selected=true
    }

    function go(){
    location=temp.options[temp.selectedIndex].value
    }

    function displaydesc(){
    var desc=descr[document.doublecombo.event.selectedIndex][document.doublecombo.stage2.selectedIndex];
    if (document.all) descriptions.innerHTML=desc;
    else if (document.getElementById) document.getElementById("descriptions").innerHTML=desc
    }

    displaydesc()
    //-->
    </script>

  • #4
    Regular Coder godofreality's Avatar
    Join Date
    Jan 2009
    Posts
    234
    Thanks
    1
    Thanked 15 Times in 15 Posts
    you should wrap your code in [ CODE ] code goes here [/ CODE ] tags when posting code and as for a possible fix you could add this
    Code:
    <img id="pic" src="" alt="" />
    after
    Code:
    <span id="descriptions" align="left" style="font:13px Arial"></span>
    and add in sum img handling code to your javascript like so
    Code:
    var img = new Array(groups);
    img[1][0] = "yahoo.jpg"; // etc etc u get the idea here i hope
    and this part here
    Code:
    function displaydesc(){
    var desc=descr[document.doublecombo.event.selectedIndex][document.doublecombo.stage2.selectedIndex];
    imgX=img[document.doublecombo.event.selectedIndex][document.doublecombo.stage2.selectedIndex];
    if (document.all) {descriptions.innerHTML=desc; }
    else if (document.getElementById) { document.getElementById("descriptions").innerHTML=desc; }
    document.getElementById("pic").src = imgX;
    document.getElementById("pic").alt = desc; }
    }
    also as a side note u can prolly get rid of the document.all stuff

    Code:
    function displaydesc(){
    var desc=descr[document.doublecombo.event.selectedIndex][document.doublecombo.stage2.selectedIndex];
    imgX=img[document.doublecombo.event.selectedIndex][document.doublecombo.stage2.selectedIndex];
    document.getElementById("descriptions").innerHTML=desc;
    document.getElementById("pic").src = imgX;
    document.getElementById("pic").alt = desc;
    }
    that right there should be all u need in that function for it to work in all browsers currently
    Last edited by godofreality; 11-08-2009 at 07:52 AM.
    woot found the avatar options...i swear they didn't exist b4

  • Users who have thanked godofreality for this post:

    shadowplay (11-08-2009)

  • #5
    New to the CF scene
    Join Date
    Nov 2009
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    thanks godofreality you are the best!!!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •