Results 1 to 2 of 2

Thread: how to make fields appear when selecting multiple checkboxes

  1. #1
    Join Date
    Sep 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default how to make fields appear when selecting multiple checkboxes

    Hi everyone,

    I am having trouble with some javascript and was wondering if I could get some help. I have a form which has checkboxes for choosinga cms platform, and when selecting a checkbox, another fieldset underneath containing a textbox for the platform version slides down.

    This is the code I am using:


    <script>
    $(document).ready(function(){
    $("#platform-option").css("display","none");

    $(".platformbox").click(function(){
    if($("#joomla").attr("checked")==true){
    $("#platform-option").slideDown("fast"); //Slide Down Effect
    } else {
    $("#platform-option").slideUp("fast"); //Slide Up Effect
    }
    });
    });
    </script>


    What I am stuck with is applying this code to more than one checkbox. Currently it only works when the 'joomla' checkbox is selected. I want to apply this to another checkbox too, so that when either 'joomla' or 'wordpress' is selected from the list of checkboxes, the 'platform version' field appears. And when another checkbox apart from 'joomla' or 'wordpress' are selected, the 'platform version' field is hidden again.

    Thanks in advance for your help, it is much appreciated

  2. #2
    Join Date
    Oct 2008
    Posts
    60
    Thanks
    2
    Thanked 7 Times in 7 Posts

    Default

    Your code is fine but i re wrote it to suit your needs. I hope this is what you were looking for. Basically you need to impliment the "else if" statement.

    HTML Code:
    // First hide the platform options
    $("#platform_option").hide();
    // now toggle if checked, but first assign click to the checkboxes
    #("#joomla,#wordpress").click(function() {
        if($("#joomla").attr("checked")==true) {
            $("#platform_option").show('slow');
        } else if($("#wordpress").attr("checked")==true) {
            $("#platform_option").show('slow');
        } else {
            $("#platform_option").hide('slow');
        }
    });

Bookmarks

Posting Permissions

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