Question

I am trying to make links work which we click to change the language of website using JavaScript. Here is the HTML code:

'<form action="" method="post" name="currlang">'.
    '<input type="hidden" name="languageval" value="'.$session->value("language").'"/>'.
    '<a onclick="langa(this, \'en\');" class="langs'.($session->value("language")=='en'?" active":"").'" id="en"></a>'.
    '<a onclick="langa(this, \'it\');" class="langs'.($session->value("language")=='it'?" active":"").'" id="it"></a>'.
    '<a onclick="langa(this, \'pl\');" class="langs'.($session->value("language")=='pl'?" active":"").'" id="pl"></a>'.
'</form>'.

and here the javascript:

function langa(obj, valu) {
    document.getElementsByName("languageval")[1].value=valu;
    document.getElementsByName('currlang')[1].submit();
}

The script works fine on new browsers (Firefoxe, Opera, Chrome, IE9) but when testing it on IE8 it gives an error:

“‘document.getElementsByName(…).1’ is null or not an object”.

After some research I found out that getElementsByName() is not supported by IE8 and above and maybe the solution would be to use jQuery and this is where I need help.
How can I make this work with jQuery or without it?

Answer 1

You can try using an ID or class to achieve the same purpose instead of name.

Example:

<div id="foo">This is id of foo</div>
<div class="choo">This is class of choo</div>

Then if you use ID then use:

document.getElementById('foo');

and with class use:

document.getElementsByClassName('choo');

I hope this helps!