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!!!

Can you please post your javascript code which you are trying? — Kiran
– Kiran, Commented Nov 23, 2011 at 10:32

Quentin · Accepted Answer · 2011-11-23 10:50:21Z

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.

answered Nov 23, 2011 at 10:50

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

user956584 · Accepted Answer · 2011-11-23 10:32:41Z

1

You can use eval to execute javascript code

eval(ajax.request);

answered Nov 23, 2011 at 10:32

user956584

5,5875 gold badges44 silver badges51 bronze badges

1 Comment

Rory McCrossan Over a year ago

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

Quentin · Accepted Answer · 2011-11-23 10:35:52Z

0

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.

answered Nov 23, 2011 at 10:35

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

2 Comments

Vitalii Ponomar Over a year ago

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 Over a year ago

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.

Collectives™ on Stack Overflow

AJAX - how to load javascript code not html?

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related