javascript - How to show or hide the heading in php -


hi need hide text once click on add button , form should displayed.here code.

<h2 style="font-size: 2em; margin-bottom: 0.75em; margin-left: -1%;">specify co-owners self occupied property</h2> <div class="last" style="margin-right: 0; padding-right: 0;">     <div class="last" style="width: 710px;">         <p class="narrate quiet" style="margin-left: 2%; width: 100%;margin-bottom: 0.75em;"> <b>would add co-owner? </b></p>     </div> </div>  //here add button , go button if click in add button form should displayed else t should show same text.//  <div class="span-12 last mt10" style="margin-top:-3%;margin-left:2%;">     <a class="large awesome oranges"  >add property co-owner</a> </div> <div class="span-12 last mt10" style="margin-top:-3%;margin-left:51%;">     <a class="large awesome orange"  href="property.php">go </a> </div>  <p>you haven't added co-owners yet.</p>  //my form starts here//  <h2>owner property details</h2> <input  type='hidden' value="<?php echo $username; ?>" name='email'> <p><label for="name_coowner">coowner name</label> <input id="name_coowner" type="text"    name="name_coowner"  /></p> <p><label for="pan_coowner">pan of coowner</label> <input id="pan_coowner" type="text"   name="pan_coowner"  /></p>   

if open page iam getting form in owner property details should shown when click on add property owner.remaining other should hidden should show form thats it.

replace code this:
note:
requires working internet connection fetching jquery library on internet

    <html>     <head>         <title>title of website</title>         <style>             .hidden             {                 display:none;             }         </style>         <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">         </script>         <script>             $(document).ready(function () {                 $('.add-property').click(function () {                     $('.hidden').toggle('slow');                     $('#add-owner-div').addclass('hidden');                     $('#go-back-div').addclass('hidden');                  });             });         </script>     </head>     <h2 style="font-size: 2em; margin-bottom: 0.75em; margin-left: -1%;">specify co-owners self occupied property</h2>     <div class="last" style="margin-right: 0; padding-right: 0;">         <div class="last" style="width: 710px;">             <p class="narrate quiet" style="margin-left: 2%; width: 100%;margin-bottom: 0.75em;"> <b>would add co-owner? </b></p>         </div>     </div>     <div class="span-12 last mt10" style="margin-top:-3%;margin-left:2%;" id="add-owner-div">         <a class="large awesome oranges add-property"  >add property co-owner</a>     </div>     <div class="span-12 last mt10" style="margin-top:-3%;margin-left:51%;" id="go-back-div">         <a class="large awesome orange"  href="property.php">go </a>     </div>     <p>you haven't added co-owners yet.</p>     <h2>owner property details</h2>     <div class="hidden" style="display:none">         <form>             <input type='hidden' value="<?php echo $username; ?>" name='email'>             <p><label for="name_coowner">coowner name</label> <input id="name_coowner" type="text"    name="name_coowner"  /></p>             <p><label for="pan_coowner">pan of coowner</label> <input id="pan_coowner" type="text"   name="pan_coowner"  /></p>           </form>     </div> </html> 

if have other css libraries or bootstrap can include in head tag php not option this. if want php dependent value can use jquery ajax.


Comments

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -