user1261774
user1261774

Reputation: 3695

Call external javascript file from a select drop down list

I have a select drop down:

<select lang="en" >
<option label=" Select a keyboard language" selected="selected" />
<option value="af" label="Afrikaans / Afrikaans" />
<option value="sq" label="Albanian / shqipe" />
<option value="ar" label="Arabic / العربية" />
<option value="hy" label="Armenian / Հայերեն" />
    ........
</select>

I have external JavaScript files (C:[PATH]\js_files): af.js, sq.js, ar.js, hy.js, etc.

How do I call and load the relative external JavaScript files when a user makes a language selection?

My js skills are not so great as to solve this.

Thanks.

Upvotes: 0

Views: 2748

Answers (1)

GitaarLAB
GitaarLAB

Reputation: 14645

So essentially you are only looking for this? :

javascript in head:

function loadJS(v){
    var d=document, h=d.getElementsByTagName('head')[0], newScript;
    try {h.removeChild(d.getElementById('lib_lang'));} catch (e){}
    newScript      = d.createElement('script');
    newScript.id   = 'lib_lang';
    newScript.type = 'text/javascript';
    newScript.src  = '[PATH]/'+v+'.js';   // change your path here
    h.appendChild(newScript);
}

html in body:

<select lang="en" onchange="loadJS(this.value)">
    <option selected="selected" disabled="true"> Select a keyboard language</option>
    <option value="af">Afrikaans / Afrikaans</option>
    <option value="sq">Albanian / shqipe</option>
    <option value="ar">Arabic / العربية</option>
    <option value="hy">Armenian / Հայերեն</option>
</select>

DEMO JSFiddle here.

Hope that helps, good luck!

Upvotes: 3

Related Questions