AJAX - how to load javascript code not html?

Question

I use jQuery with $('#countryid').load('/some/url',{country: country_id}); function to automatically load options for regions depending on selected country before.

And it works fine when I load html through ajax.

But I need to load javascript code. When I try to do that all select fields disappear from page at all...

What am I doing wrong?

Code:

<script type="text/javascript">
$(document).ready(function() {
 $('#countrydropdown').change(function() {
 var countryvalue = $('#countrydropdown option:selected').val();
 if(countryvalue==0){clearlist();}
 getarea();
 });
});
function getarea(){
 var countryvalue = $('#countrydropdown option:selected').val();
 var area = $('#areadropdown');
 if(countryvalue==0){
 area.attr("disabled",true);
 }else{
 area.attr("disabled",false);
 area.load('/ajax/2/',{country: countryvalue});
 }
}
function clearlist(){
 $('#areadropdown').empty();
}
</script>
<form action="" id="form">
 <select id="countrydropdown">
 <option value="0">Countries</option>
 ...
 </select>
 <select id="areadropdown" disabled="disabled">
 </select>
</form>

Thanks!!!

• Kiran: Can you please post your javascript code which you are trying?

Answer 1

Based on the code your comment on my previous answer suggests you are using:

<script type="text/javascript">for(var i in arr) document.write(arr[i]);</script>

After the page has loaded, the document will enter the closed state.

You cannot document.write to a document in the cosed state, so document.open will be automatically called.

This will trash the existing document so a new one can be written.

Use DOM to manipulate the document, don't go near document.write.

Answer 2

You can use eval to execute javascript code

eval(ajax.request);

• Rory McCrossan: If eval() is the only solution to your problem, you really need to think of an alternative method and restructure your code accordingly.

Answer 3

If you are loading just JavaScript, then use getScript instead of load.

If you are loading a combination of HTML then JavaScript, then I would give serious consideration to refactoring so that the JavaScript is already in place and events are handled using live instead of being bound directly to the elements themselves.

• Vitalii Ponomar: What's the difference between html and <script type="text/javascript">for(var i in arr) document.write(arr[i]);</script>? I can say - it is also html.
• Quentin: Scripts get special handling when they hit innerHTML ... but now you've shown us the code you are trying to run... see the other answer I'm about to write.