CODEWITHSUNDEEP
javascriptdjangotwitter-bootstrap
Houman
Houman

Reputation: 66320

simple onclick doesn't submit

I have found this great code snippets on this blog to change the language selector for something more stylish. (Twitter-bootstrap in mind)

It looks pretty neat, however when I actually click on the selection, nothing is submitted on onclick. I am not yet an expert in jquery, but could something have been deprecated in latest 1.8.0 version that stops the onclick from working? 

<form name="setLang{{ lang.1}}" action="/i18n/setlang/" method="POST">{% csrf_token %}
   <input name="next" type="hidden" value="{{ redirect_to }}" />
   <input type="hidden" name="language" value="{{ lang.0 }}" />
   <a href="#" onclick="document.setLang{{ lang.1 }}.submit(); return false;">{{ lang.1 }}</a>
</form>

Upvotes: 0

Views: 367

Answers (2)

Jo&#227;o Silva
Jo&#227;o Silva

Reputation: 91319

You can't use document.setLang{{ lang.1 }} to get the form. That's not a valid name for a DOM element. JavaScript will break processing at the first whitespace it encounters, and throw an error.

I strongly suggest you use a valid name value, but if you really need to keep using that, you can access the element with document.getElementsByName("setLang{{ lang.1}}")[0].submit().​​​​

Upvotes: 2

scott.korin
scott.korin

Reputation: 2597

The fact that your form name has spaces in it means you can't access the form item in the DOM the way you are intending to. I would give the form an id that doesn't contain spaces and access it that way.

<form name="setLang{{ lang.1}}" id="setLang" action="/i18n/setlang/" method="POST">{% csrf_token %}
   <input name="next" type="hidden" value="{{ redirect_to }}" />
   <input type="hidden" name="language" value="{{ lang.0 }}" />
   <a href="#" onclick="document.setLang.submit(); return false;">{{ lang.1 }}</a>
</form>

Also, see here: Accessing HTML input fields with javascript - spaces in input name

Upvotes: 1

Related Questions