jquery help

[eluser]bigdaddysheikh[/eluser]
Now,

I think this is a simple solution but it does not work. I have a jquery ajax code to help load data from select menu and populate a div.

But when i place this code in the middle of the page nothing loads or happens. No errors at all.

Code:

[removed]
        $('buildingList').load("index.html");        
[removed]

[eluser]spherop[/eluser]
is your div...
<div id="buildingList"> ....</div>

if so, you need $("#buildingList").load("index.html")

some more code would be helpful. "#" for objectid, "." for classes.

[eluser]bigdaddysheikh[/eluser]
Hey,


Ok here is the code in the header:

Code:

function displayVals(id) {
                  var singleValues = $(id).val();
                  return singleValues;
                }
        
        
            $("select[id*='option_']").change(function()
                {    
                    $('div#buildingList').load(displayVals($("select[id*='option_']")));
                });

This is for the dropdown. When Select certain item show that value etc...

This code works fine.

This is the code that does not work at all. It is placed in the body of the html page.

Code:

$('#buildingList').load("index.html");

The whole process is this. The initial page is a listing of info. Drop down sorts the info in certain ways. But when the page is initially loaded without selecting anything, i want it to load a file or segment of my class.

[eluser]spherop[/eluser]
is the line below the div in the code? it would still be good to see the div code itself..

are you using firefox? get that and firebug extension if you don't already. indispensable for ajax stuff.

with that, you can look at the console pane and see if the call is being made, and what content is or isn;t returning. stuff you can't see on the page when nothing seems to be happening.

[eluser]bigdaddysheikh[/eluser]
Here is the code on my view page.

Code:

<div id="rightCol">
<h2>Building Managament</h3>
        <p><label for="region">Select a city</label>
        <select name="ajaxbuild" id="option_">
            <option SELECTED>Select</option>
            &lt;? foreach ($region->result_array() as $row){ ?&gt;
            <option value="&lt;?=base_url()?&gt;/index.php/admin/building/buildlist/&lt;?=$row['ID']?&gt;">&lt;?=$row['name']?&gt;</option>
            &lt;? } ?&gt;
        </select></p>
        <span style="color: #EC1A23; font-size: 18px;">&lt;?=$message?&gt;</span>    
[removed]
        $('div#buildingList').load("index.html");
[removed]
    <div id="buildingList"></div>
</div>

[eluser]spherop[/eluser]
well the line
$('div#buildingList').load("index.html");
is being hit before the div is rendered.

try putting inside
$(function(){
$('div#buildingList').load("index.html");
});

which is jquery shorthand for executing after page is loaded.

also, double check things with firefox/firebug.