mercredi 15 juillet 2015

how to simplify this javascript code [on hold]

var checkbox = document.getElementById('checkbox');
var checkbox1 = document.getElementById('checkbox1');
var delivery_div = document.getElementById('delivery');
var delivery_div1 = document.getElementById('delivery1');
checkbox.onclick = function() {
  console.log(this);
  if (this.checked) {
    delivery_div.style['display'] = 'block';
  } else {
    delivery_div.style['display'] = 'none';
  }
  document.getElementById("checkbox1").checked = false;
  delivery_div1.style['display'] = 'none';
};
checkbox1.onclick = function() {
  console.log(this);
  if (this.checked) {
    delivery_div1.style['display'] = 'block';
  } else {
    delivery_div1.style['display'] = 'none';
  }
  document.getElementById("checkbox").checked = false;
  delivery_div.style['display'] = 'none';
};
<div class="form-group">
  check any checkbox
  1<input id="checkbox" type=checkbox name=check>
  2<input id="checkbox1" type=checkbox name=check>
</div>

<div id="delivery" style="display:none;">
  <div class="form-group">
    certain form content is shown
  </div>
</div>
<div id="delivery1" style="display:none;">
  <div class="form-group">
    different from above form content is shown
  </div>
</div>

NOTE This code is used for displaying only certain content of the form instead of displaying all the form content. I am using it to stop the users from filling all the form fields if those are irrelevant to the user. Please feel free to change the code. :)




Aucun commentaire:

Enregistrer un commentaire