how to load a div into html using jquery

Question

I'm trying to load a div into a page based on a change in the drop down. I either want to show a div which has state/zip or province/postal_code, (each is a file) but I am getting a "406 Not Acceptable [http://localhost/profiles/residency]"

Here is my JQuery code:

$(function(){
    $("#profile_country").change(onSelectChange);
});

function onSelectChange() {
    var selected = $("#profile_country option:selected");
    var selectedText = selected.text();

    if (selectedText == 'United States') {
        $("#residency").load("/profiles/residency");
    }
    else {
        $("#residency").load("/profiles/residency");
    }
}

Now I am at loss, what should be in my "residency method"? what to put in my routes file?

Answer 1

A 406 Not Acceptable response means the Content-Type of the data to be returned is not of a type specific in the Accept header. I suggest you use Firebug to diagnose further.

More information from the W3C HTTP/1.1 Status Code Definitions

Answer 2

The problem could be with the Content-Type of your request : Error 406 is usually related to the "Accept" headers so I suppose jquery ask for a specific Content-Type that does not match what the web server gives...

Look at the headers you send when your URL is called. You may have to change your file name to ".html"