I am trying to create a script to develop a chained select, but the simplest thing doesn't work. Note that a know very little about js and jquery.

I create my dropdown list with CodeIgniter: <?php echo form_dropdown('city', array(), "", 'id="ciudades"'); ?>

Then load the script:

if (isset($add_select_sources))
{
    echo "
    <script type='text/javascript' src='.4.4/jquery.min.js'></script>
    <script src='" . $root_path . "js/jquery-1.10.2.js'></script>
    <script type='text/javascript' src='" . $root_path . "js/select.js'></script>
    ";
}

I am sure that add_select_sources is true, it is tested.

And then my select.js: $('#ciudades').hide();

What am I doing wrong?

I am trying to create a script to develop a chained select, but the simplest thing doesn't work. Note that a know very little about js and jquery.

I create my dropdown list with CodeIgniter: <?php echo form_dropdown('city', array(), "", 'id="ciudades"'); ?>

Then load the script:

if (isset($add_select_sources))
{
    echo "
    <script type='text/javascript' src='http://ajax.googleapis./ajax/libs/jquery/1.4.4/jquery.min.js'></script>
    <script src='" . $root_path . "js/jquery-1.10.2.js'></script>
    <script type='text/javascript' src='" . $root_path . "js/select.js'></script>
    ";
}

I am sure that add_select_sources is true, it is tested.

And then my select.js: $('#ciudades').hide();

What am I doing wrong?

• javascript
• php
• jquery
• codeigniter

2 Answers 2

Make sure that your javascript is being executed after jQuery is being included.

Also, you should execute your jQuery within a "Document Ready closure":

$(document).ready(function(){
    $('#ciudades').hide();
});

There have been issues with people trying to do this. So there are some more things I'd like to suggest:

• Make sure that your elements have a width/height/display-block etc
• Try $('#ciudades').show().hide(); as some people have had that issue too!
• console.log() your events to see if they are being fired:

    $(document).ready(function(){
        console.log('doc ready');
        $('#ciudades').show().hide();
        console.log('element hidden');
    });

Also, why are you using PHP to echo out script tags?

This will easily do.

$(document).ready(function(){
    $('#yourEelementId').hide();
});