Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>What you could do :</p> <p>Add an hidden input in your form. Change its value when you check / uncheck.</p> <p>When the page is refreshed through the submit, check the value of the hidden field (via $_POST or $_GET) and add the attribute checked="checked" if needed.</p> <p>Checkbox should be checked then and the HTML should be visible.</p> <p>Here's something working for me</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml" &gt; &lt;head&gt; &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;form action="&lt;?php echo $_SERVER['PHP_SELF'] ?&gt;" method="post"&gt; &lt;input type="hidden" id="verifyCheckbox" name="verifyCheckbox" &lt;?php if(isset($_POST['verifyCheckbox']) &amp;&amp; $_POST['verifyCheckbox'] == "true") { echo 'value="true"'; } ?&gt;/&gt; &lt;input type="checkbox" id="yes" &lt;?php if(isset($_POST['verifyCheckbox']) &amp;&amp; $_POST['verifyCheckbox'] == "true") { echo 'checked="checked"'; } ?&gt; /&gt; &lt;input type="submit" /&gt; &lt;/form&gt; &lt;div class="test"&gt; &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus a facilisis risus. Nam quis sapien turpis, non porttitor ante. In vulputate arcu non diam porttitor vulputate. Aenean leo est, adipiscing a egestas ut, dapibus sit amet purus. Quisque pellentesque mi ac orci placerat congue. Nulla sodales mollis arcu sed viverra. Integer id metus turpis. Vivamus interdum convallis sagittis. Quisque quis tellus ante, a consequat eros. Donec tincidunt luctus dolor. Nulla pulvinar, odio et consectetur dictum, mauris massa vulputate magna, et pretium mauris tortor vel nibh. Donec quis tortor lacus, sed fringilla dui. Duis diam nulla, faucibus vel malesuada quis, auctor nec lorem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam iaculis tristique mauris vitae facilisis. Nulla facilisi. Nulla non nisl id lacus laoreet auctor sit amet non tellus. Vestibulum quis nibh sed ligula tempor scelerisque. Nunc pretium dapibus convallis. Proin pulvinar, tellus vitae imperdiet rhoncus, elit justo scelerisque libero, nec iaculis lacus turpis ut est.&lt;/p&gt; &lt;/div&gt; &lt;script type="text/javascript"&gt; $(document).ready(function(){ //Hide div w/id extra $(".test").css("display","none"); // Add onclick handler to checkbox w/id checkme $("#yes").click(function(){ // If checked if ($("#yes").is(":checked")) { //show the hidden div $("#verifyCheckbox").val("true"); $(".test").show("fast"); } else { //otherwise, hide it $("#verifyCheckbox").val("false"); $(".test").hide("fast"); } }); &lt;?php if(isset($_POST['verifyCheckbox']) &amp;&amp; $_POST['verifyCheckbox'] == "true") { echo '$(".test").show();'; } ?&gt; }); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload