www.webdeveloper.com
Results 1 to 7 of 7

Thread: [RESOLVED] Conditional Elements Script

  1. #1
    Join Date
    Feb 2010
    Posts
    4

    resolved [RESOLVED] Conditional Elements Script

    Good Morning,

    I am not familiar with Javascript and have been working on creating conditional elements for a web form. We have a Joomla site and have been using RSForm Pro to create the form. The developer of the program has a tutorial on creating these types of hidden/visible fields which after a lot of trial and error I was mostly able to make work.

    I basically have a radio field that triggers a set of fields to be hidden or visible. My problem is that by default, those fields are displayed and only go away when the user selects "no". I'd like to reverse that and have the fields hidden until the user checks "yes" at which time they display.

    The script I am using is below, and the {2nd Location} is the field name for the radio button. Can anyone help me with this issue?

    <script type="text/javascript">
    function displayField()
    {
    if(document.getElementsByName('form[2nd Location]')[0].checked)
    document.getElementById('hide').style.display="none";

    if(document.getElementsByName('form[2nd Location]')[1].checked)
    document.getElementById('hide').style.display="";
    }
    </script>

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Code:
    function displayField()
    {
    document.getElementById('hide').style.display = (document.getElementsByName('form[2nd Location]')[0].checked)? 'none' : '';
    }
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Feb 2010
    Posts
    4
    Hi Fang,

    Thank you for replying. I tested the code and it runs the same as the previous code, it still switches correctly but the fields are still present when the form loads. Could I be doing something wrong outside of the script?

  4. #4
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    You may need to set the onload differently in Joomla
    Code:
    window.onload=function() {
    document.getElementsByName('form[2nd Location]')[0].checked = true; //1st is 'no'
    displayField();
    };
    At least 98% of internet users' DNA is identical to that of chimpanzees

  5. #5
    Join Date
    Feb 2010
    Posts
    4
    Thanks again, Fang. That's definitely not it, screen just showed blank. I'm sure that had to do the with program and it's limitations. What about calling the "no" answer as a default so when the form loads, "no" will be selected and the fields will be hidden. RSForm Pro has an "Additional Attributes" box that I can plug code into.

    If this helps, this is the code from their documentation I am working off of.
    http://www.rsjoomla.com/customer-sup...de-fields.html

  6. #6
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Place this after the function script and after the form:
    Code:
    <script type="text/javascript">
    document.getElementsByName('form[2nd Location]')[0].checked = true; //1st is 'no'
    displayField();
    </script>
    the "no" answer as a default so when the form loads, "no" will be selected and the fields will be hidden
    You would still have to call the function
    At least 98% of internet users' DNA is identical to that of chimpanzees

  7. #7
    Join Date
    Feb 2010
    Posts
    4
    Amazing. I figured I was going to do something wrong but just as you said and it worked. Thank you very, very much!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles