<p>

  Check me!

</p>

​

<!-- Default unchecked -->

<div class="custom-control custom-checkbox">

    <input type="checkbox" class="custom-control-input" id="defaultUnchecked" onclick="javascript:toggleDiv('id_div_hostname');">

    <label class="custom-control-label" for="defaultUnchecked">Default unchecked</label>

</div>

​

​

<div class="md-form" id="id_div_hostname" style="display: none;">

        <input type="text" name="port1_name" class="form-control" id="id_hostname">

        <label for="id_hostname" class="disabled">Hostname</label>

</div>