How to replace form with other when javascript is enabled?

Question

Below is a form which would appear no matter javascript is enabled or disabled.

<?php
if (logged_in()) {
echo "
    <form method='post' name='form' action='' class='oldform'>
        <textarea  name='content' id='content' ></textarea>
        <input type='submit' value='post' name='submit'/>
    </form>";
  }
  ?>

Now I want to replace the above form with another form when javascript is enabled complying with the logged_in php code. I think code below will hide old form and display new form but I am not able to get how to put script in echo so when javascript is enabled <script> replaces old form with new.

<script>
    <style>
     .oldform{display:none;}
     </style>

    <form name="newform">
    </form>
<script>

I would put your entire form in a `noscript` tag if javascript is disabled, looks neater. — Daan, Jan 06 '16 at 14:01

score 1 · Accepted Answer · answered Jan 06 '16 at 14:06

To improve load time, and prevent errors with css in old browsers, you can (though it requires a second page visit) use javascript to set a cookie.

If the cookie exists server-side (they have javascript) render form 1, else form 2.

page html

<script type="text/javascript">
  document.cookie = 'hasJS=true';
</script>

page php

if (isset($_COOKIE['hasJS'])){
  // Form 1
}else{
  // Form 2
}

How to replace form with other when javascript is enabled?

1 Answers1