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 6 of 6
  1. #1
    New Coder
    Join Date
    Sep 2006
    Location
    Fostoria, Ohio
    Posts
    35
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Button links Scroll box

    Has anyone ever seen this before? I have a list of about 15 different color schemes, although I have 5 Accessibility Themes that I would like quick button access to, When the user clicks on the button it will change the drop down to the correct color scheme. My Mootools will do the rest from there, when they click on Apply Colors.

    For those of you who want to see an example, you can go to www.jbrowns.com/clients/rjs and click on the color chooser. You will see everything there.

    <script type="text/javascript">
    function changeText(){
    var x=document.getElementById("color-select")
    *** What do I need here ***
    }
    </script>

    <select id="color-select">
    <option>Black</option>
    <option>White</option>
    <option>Red</option>
    <option>Green</option>
    </select>

    <img src="/images/Green.png" width="32px" onclick="changeText()" />
    <img src="/images/Black.png" width="32px" onclick="changeText()" />
    <img src="/images/White.png" width="32px" onclick="changeText()" />

    Thanks,
    Jeff

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Could be:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>untitled</title>
    <script type="text/javascript">
    function changeText(c){
    var opt=document.getElementById("color-select").options, i=0, o;
    while(o=opt[i++]){
    o.selected=o.text==c;
    }
    }
    </script>
    </head>
    <body>
    <form>
    <select id="color-select">
    <option value="Black">Black</option>
    <option value="White">White</option>
    <option value="Red">Red</option>
    <option value="Green">Green</option>
    </select>
    <br>
    <span onclick="changeText('Black')">Black</span>
    <span onclick="changeText('White')">White</span>
    <span onclick="changeText('Red')">Red</span>
    <span onclick="changeText('Green')">Green</span>
    </form>
    </body>
    </html>
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • Users who have thanked Kor for this post:

    jbrown1028 (06-09-2008)

  • #3
    New Coder
    Join Date
    Sep 2006
    Location
    Fostoria, Ohio
    Posts
    35
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Great Job Kor...

    Yes, I wasn't even think a to use while syntax for this method. Although still having an issue (now I believe it is in my coding for the color switcher) this functioned perfectly.

    Thank you

  • #4
    New Coder
    Join Date
    Sep 2006
    Location
    Fostoria, Ohio
    Posts
    35
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Since this is a completly custom code, and I don't think anyone else would ever use it, with the assistance of Kor for the first part and I found the remainding solution to the problem.

    By adding this to the <script></script>:
    window.addEvent('domready', function() {
    var colorSelect = $('color-select');
    $$('.abutton').addEvent('click', function() {
    colorSelect.fireEvent('change');
    });
    });

    and adding class="abutton" to the <img> tags worked perfectly.

  • #5
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Quote Originally Posted by jbrown1028 View Post
    Since this is a completly custom code, and I don't think anyone else would ever use it, with the assistance of Kor for the first part and I found the remainding solution to the problem.

    By adding this to the <script></script>:
    window.addEvent('domready', function() {
    var colorSelect = $('color-select');
    $$('.abutton').addEvent('click', function() {
    colorSelect.fireEvent('change');
    });
    });

    and adding class="abutton" to the <img> tags worked perfectly.
    Take care not to confound javascript language with custom methods of javascript frameworks/libraries. There is no $() $$() addEvent() or fireEvent() native methods in javascript.
    Last edited by Kor; 06-11-2008 at 07:53 AM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #6
    New Coder
    Join Date
    Sep 2006
    Location
    Fostoria, Ohio
    Posts
    35
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Kor View Post
    Take care not to confound javascript language with custom methods of javascript frameworks/libraries. There is no $() $$() addEvent() or fireEvent() native methods in javascript.
    Ahh yes, this is a huge custom script that is combining Mootools, Ajax, JavaScript with PHP.

    So yes, those are not native methods for JS, sorry for the confusion for anyone.

    Thanks for the heads up.


  •  

    Posting Permissions

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