Hide html from when checkbox is checked via php

Question

In my project I have a HTML page, some part of HTML file should display when a checkbox is checked, I used a Form tag cause I should submit that parameters to the server. Here is that part of HTML file : ( The HTML file name is config.html)

<input type="checkbox" name="advancecheck" id="advancecheck" onchange="valueChanged()">
<br>   
<script type="text/javascript">
    function valueChanged()
    {
        if($('.advancecheck').is(":checked"))   
            $(".subnetmaskdiv").show();
        else
            $(".subnetmaskdiv").hide();
    }
</script>
<form action="" method="post" name="subnet">
    <div id="subnetmaskdiv">
        <label>Subnet Mask</label>
        <input type="text" name="subnetmask" id="subnetmask">
        <br>
    </div>
</form>

I did that in HTML file. I include this HTML file in my Php file : ( My Php file name is configwireless.php )

I tried different ways to do this, But no chance. Could anybody tell me what is the correct way by a simple sample? Any help will appreciate. thanks to all.

Add your code what you tried, we all are here to give suggestion and solve not for doing your code. :) — Kausha Mehta, May 22 '17 at 06:11
to hide html when you check a checkbox you need to use javascript — Professor Abronsius, May 22 '17 at 06:13
I can't understand your question, what do you exactly want to achieve? — node_modules, May 22 '17 at 06:13
http://stackoverflow.com/questions/25853803/show-hide-input-field-based-on-checkbox — M Bilal Khan, May 22 '17 at 06:17

score 4 · Accepted Answer · edited Nov 22 '19 at 04:44

4

Try this, hope to work

<input type="checkbox" name="advancecheck" id="advancecheck" 
onchange="valueChanged()"/><br>

<script type="text/javascript">

    function valueChanged() {
      if (document.getElementById('advancecheck').checked) {
          document.getElementById("subnetmaskdiv").style.display = 'block';
      } else {
        document.getElementById("subnetmaskdiv").style.display = 'none';
      }
    }

</script>

<form action="" method="post" name="subnet">
  <div id="subnetmaskdiv" style="display:none;">
    <label>Subnet Mask</label>
    <input type="text" name="subnetmask" id="subnetmask"><br>
  </div>
</form>

edited Nov 22 '19 at 04:44

cwoodwar6

25
5

answered May 22 '17 at 07:25

Hanni

86
5

Such a great Idea! Thanks And I want if i uncheck it disappear again. I change the code to `function valueChanged(){ if (document.getElementById('advancecheck').checked) { document.getElementById("subnetmaskdiv").style.display = 'block'; } else if(! (document.getElementById('advancecheck').checked)) { elsedocument.getElementById("subnetmaskdiv").style.display = 'none'; } }` But no chance, – me_the_seven May 22 '17 at 08:39
you don't need to change the code. In my code, if checkbox is clicked, 'div' will appear. if it is not checked, "div" will disappear – Hanni May 22 '17 at 09:08

score 0 · Answer 2 · answered May 22 '17 at 06:18

0

For example:

<div id="autoUpdate" class="autoUpdate">
   content
</div>

Checkbox here:

<input type="checkbox" id="checkbox1" />

And if you want to hide that div on checkbox click, then

<script type="text/javascript">
$('#checkbox1').change(function(){
        if (this.checked) {
            $('#autoUpdate').hide();
        }

    });
</script>

This is just an example for your reference.

answered May 22 '17 at 06:18

Virb

1,639
1
16
25

I edited the question. I am brand new to Php and this a force project. Where should I do your code? In the html file or in php file? I have separate them. – me_the_seven May 22 '17 at 07:00

Hide html from when checkbox is checked via php

2 Answers2