HTML code for selection box in a Joomla module: selection box doesn't change.

Hello,

I'm Jun from the Netherlands and I found an article yesterday about dopdown 
checkbox list based on jQuery.
After trying to install jQuery for 2 days by myself in the first place, I got 
it working. Then I tried to install the dropdown checkbox list
which took days to get it working. I could not see a tutorial how to do all of 
this.

I have a website and my template is a Gavick.com template, which is based on 
Gavern Framework. In this case I have to put all javascript files location to a 
file called head.php not index.html.
And in order to load those files I cannot put the codes which you use to call 
in the same file.

I have put the code below to a file called header.php for example (just to 
test):

 "   <!-- Use a JQuery ThemeRoller theme, in this case 'smoothness' -->
    <link rel="stylesheet" type="text/css" href="css/jquery-ui-1.8.13.custom.css"/>
    <link rel="stylesheet" type="text/css" href="css/ui.dropdownchecklist.themeroller.css"/>

    <!-- Include the basic JQuery support (core and ui) -->
    <script type="text/javascript" src="Scripts/jquery-1.6.1.min.js"></script>
    <script type="text/javascript" src="Scripts/jquery-ui-1.8.13.custom.min.js"></script>

    <!-- Include the DropDownCheckList support -->
    <script type="text/javascript" src="Scripts/ui.dropdownchecklist.js"></script>

    <!-- Apply dropdown check list to the selected items  -->
    <script type="text/javascript">
        $(document).ready(function() {
            $(".s5").dropdownchecklist({ firstItemChecksAll: true });
            $(".s3").dropdownchecklist({ icon: {}, width: 150 });
            $(".s4").dropdownchecklist({ maxDropHeight: 150 });
            $(".s4a").dropdownchecklist({ icon: { placement: 'right', toOpen: 'ui-icon-arrowthick-1-s'
            , toClose: 'ui-icon-arrowthick-1-n'}
            });

            $("#d1").dropdownchecklist({ width: 300 });
        });
    </script>
</head>
<body>
<div id="content">
            <select size="4" name="d1" id="d1" class="s5" multiple="multiple">
                <option value="(all)">(all)</option>
                <option value="AMA">Test1</option>
                <option value="BCL">Test2</option>
                <option value="BUS">Test3</option>
        </select>
</div>
</body>
</html>
"
I can see that it's working, (not knowing if it's working well) you can as well 
by visiting granddomains.co, on the header.
But when you look at the domain extension selection you will see that this one 
isnt working.
This is actually my current situation. The domain lookup and it's selection 
area are based on a html code I put in a module
of Gavick.com called Tabs gk4, which has a form to put every html code into.

Now I have no idea how to get it work.
I had like to know which code to put in my head.php file or what code do I have 
to include in the HTML code I'm using.

I really appreciate your help.

Regards,
Jun.
Original issue reported on code.google.com by granddom...@live.nl on 24 Apr 2012 at 3:14
Ravichndra / dropdown-check-list

HTML code for selection box in a Joomla module: selection box doesn't change. #241
