0

I have a problem with the following JS function:

function toggleSortierung() {
  var form =document.getElementById("sortieren_form");
  if(form.style.display=="none") {
    document.getElementById("sortieren_form").style.display="block";
  }
  else {
    document.getElementById("sortieren_form").style.display="none";
  }
}

This is toggling the visibility of a form on and off. The form is not visible on default. The function is integrated into a link:

<a href="javascript:toggleSortierung()">Sortierung:</a>

The function actually works, but the very first click on the link is doing nothing, although it should make the form visible. After the first click the function works like expected, so it only hinders smooth usability.

JJJ
  • 32,902
  • 20
  • 89
  • 102
Torrintino
  • 19
  • 3
  • 2
    Remove, `display: none` first. Then, you can call `toggleSortierung()` once on page load. So, it will adjust the form accordingly and hide it when the page is first loaded. Now, on subsequent clicks, it will work as expected. – Mohit Bhardwaj Jun 03 '16 at 09:36
  • 1
    I've just found almost similar [question](http://stackoverflow.com/questions/37604526/how-to-call-js-function-before-html-load-completed/37604570#37604570) on the same day. – choz Jun 03 '16 at 09:39
  • Thanks, works fine now. – Torrintino Jun 03 '16 at 09:45

1 Answers1

0

put an inline style display:none in your form element.. so that it will return form.style.display as none on first click

AB Udhay
  • 643
  • 4
  • 9