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 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Help with js Table hiding

    Hi,

    Im making a website with lots of forms and am not great with java.
    i know there is a way to hide feilds on the form which can be
    viewed when a button is pressed
    (seen here:http://europass.cedefop.eu.int/instruments/cv/step0.do) all you need to do is click the "START NOW" button and you are presented with the form which has the hidden feilds.
    if you press the light bulb or the question mark it will show hidden feilds.
    i think this is a great idea and would love to be able to emulate this on
    my site.
    any help would be greatly appreciated.

    Thanks

    Dan
    Last edited by dan0x; 04-20-2005 at 04:51 PM.

  • #2
    New Coder
    Join Date
    Apr 2005
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi Dan,

    Have just done a similar thing with drop down menus using a javascript function and CSS custom classes in the <TABLE> tag. When you click on a menu header, the sub menu appears below. Click again and it dissapears.

    , the code is shown below.

    1. Place this between the <SCRIPT></SCRIPT> tags in the HEAD of the page:

    function toggleMenu(currMenu) {
    if (document.getElementById) {
    thisMenu = document.getElementById(currMenu).style
    if (thisMenu.display=="block") {
    thisMenu.display="none";
    }
    else {
    thisMenu.display="block"
    }

    return false
    }
    else {
    return true
    }
    }

    2. Create CSS classes for your tables and include the disply attribute set to none. This will initialy set your tables to be hidden. apply the class to your trigger element and give that element an ID.

    3. Surround your event trigger element (in my case a <TR> tag) with an anchor like so:

    <a href="#" onClick="return toggleMenu('menuname)">

    where menuname is the ID of the trigger element.

    4. One click will show the element, another click will hide it again.

  • #3
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks alot

  • #4
    New Coder
    Join Date
    Feb 2004
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Can I ask what you mean by trigger element, i.e. <a href="#">click here to appear</a>

    I dont understand, sorry
    Jason Morjaria


  •  

    Posting Permissions

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