The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript how to dynamically hide or reveal tables rows as needed

  • This topic is empty.
Viewing 5 posts - 16 through 20 (of 20 total)
  • Author
  • #169342
    if(document.getElementById('Subjects').options[document.getElementById('Subjects').selectedIndex].value == "Web App Development Enquiry") {
    else {

    for multiples you could just add multiples.

    for multiple “either” “or” statements you can use “&&” or “||”
    info here:

    the if part could be:
    if(document.getElementById('Subjects').options[document.getElementById('Subjects').selectedIndex].value == "Web App Development Enquiry" && document.getElementById('Subjects').options[document.getElementById('Header').selectedIndex].value == "Web App Development Enquiry" )

    Stuart Bennett

    Hi PirateStef

    I tried that and it still isn’t working

    no matter what I do it will not do what i need it to.

    perhaps if i email you the files I am working with you could figure it out for me and post the code that make it work.

    Stuart Bennett

    Hi there

    I have a Contact Us Form on my website which can be found at

    I need to hide or show certain fields in the form as needed.

    I have a codepen for this at

    I have asked many people for help with this already and the help I have received so far is partially working but not entirely resolving the issue.

    So I am going to break this down very simply.

    Theres a dropdown field on my form with an id of “ourServices” which has the following options

    General Enquiry
    Website Design Enquiry
    Website Hosting Enquiry
    Network Implementation Enquiry
    Computer Crash Enquiry
    Hardware Upgrade Enquiry
    Software Upgrade enquiry
    Mobile App Development Enquiry
    Web App Development Enquiry
    Bespoke Epos Enquiry
    SEO Enquiry

    now for the moment Website Design Enquiry, Website Hosting Enquiry & Mobile App Development Enquiry have custom questions relevant to their subject that need to pop up only if there subject is selected.

    So by default the DIV’s website, hosting & whichplatform must be hidden by default then if Website Design Enquiry is selected the div website should appear and hosting and whichplatform remain hidden if Website Hosting Enquiry is selected then both the website div and the hosting div need to appear but whichplatform div remain hidden if Mobile App Development Enquiry is selected then the whichplatform div should appear and website div and hosting div remain hidden.

    if any other value on the subject field is selected then website, hosting and whichplatform should be hidden.

    all HTML files are in the root of the site, CSS files are in the CSS folder, JavaScript files are in the JS folder and the PHP files for the forms submission processing are in the PHP folder.

    in this case the files we need to work with are contact Us.html, Contact Us.css & Contact Us.js

    the glitch i am having is in the Contact Us.js file from what i can tell so if you could please look through the exact scenario as stated above then go through my codepen code and tell me what i need to put in my js file to make this function as described above that would be really appreciated.

    Sorry about the long post but hopefully being this detailed and specific will help get the issue resolved more quickly.


    Here’s working code for you:

    You’ve got validation errors in your HTML. CodePEN will tell you these if you click the gear icon next to ‘HTML’ and click “Analyze HTML.” Here’s what it says:


    The font element is obsolete and should not be used.
    The ‘align’ attribute is no longer valid on the div element and should not be used.
    ‘colspan’ is not a valid attribute of the div element.
    The id ‘Comments’ appears more than once in the document.

    Steven Morgan
Viewing 5 posts - 16 through 20 (of 20 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.