CODEWITHSUNDEEP
javascripthtmltoggle
Prasad_Joshi
Prasad_Joshi

Reputation: 662

how to toggle html form with toggle functon in pure javascript

I'm trying to toggle a complete html form newBill with pure java script by passing an Id of the form as an argument in JS function toggleand toggling with onclick event, but not sure why its not working at all.

function toggle(id) {
  var e = document.getElementById(id);
  if (e.style.display == 'block' || e.style.display == '') {
    e.style.display = 'none';
  } else {
    e.style.display = 'block';
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="menu">
  <li><a href="#home" onclick="toggle(" newBill ")"> New Bill</a>
  </li>
</ul>
<form name="billnew" id="newBill">
  Order ID :
  <br>
  <input class="textBox" type="text" name="billid" id="order_id" />
  <!--More form fields below.-->
</form>

Upvotes: 0

Views: 1352

Answers (2)

Kiran Shinde
Kiran Shinde

Reputation: 5982

change your onclick attribute

It should be like

onclick="toggle('newBill')"

Working example https://jsfiddle.net/uz0tebLr/

Upvotes: 1

Brave Soul
Brave Soul

Reputation: 3620

perhaps on basis of your code I guess you need a single quote here

toggle("newBill") its wrong

you need this 

<a href="#home" onclick="toggle('newBill')"> New Bill</a>

Upvotes: 1

Related Questions