Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
 
<script  type="text/javascript">
    $(document).ready(function () {
        $("#hide").click(function () {
            $("p").hide();
        });
        $("#show").click(function () {
            $("p").show();
        });
    });
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <p>If you click on the "Hide" button, I will disappear.</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
    </div>
    </form>
</body>
</html>
 

in output when i click on hide button .it hides data but instantly it shows me data back too.on hide button it should only hide data
 
when i double click then only it hides .on single click it doesn't......as i have used click function not dblclick....then why is it showing like this.
help!!
 
pls tell wat i missed
thanks
Posted 23-Jan-13 18:46pm
Edited 23-Jan-13 19:02pm
v2
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

Dear Shivani...it's not working because you have used
<form runat="server"></form>
 
remove it..it will be working fine.. try this..
 
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>
</head>
<body>
<p>If you click on the "Hide" button, I will disappear.</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
</body>
</html>
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

Instead of Using following Button tags
<button id="hide">Hide</button>
<button id="show">Show</button>
 
use these html tags.
 
<input type='button' id="hide" value='Hide'/>
 
if u use <button> page gets reloaded and it display everything of ur content. just like asp:buttons. still if u want to use these buttons, please place "return false" in click functions of both buttons
 

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script src="http://code.jquery.com/jquery-latest.js"></script>
 

<script  type="text/javascript">
    $(document).ready(function () {
        $("#hide").click(function () {
 

            $("p").hide('slow');
 

        });
        $("#show").click(function () {
           $("p").show('slow');
 
        });
    });
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <p id="Ptag">If you click on the "Hide" button, I will disappear.</p>
<input type='button' id="hide" value='Hide'/>
<input type='button' id="show" value='show'/>
    </div>
    </form>
</body>
</html>
  Permalink  
v3
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 3

Solution 2 is working...Thanks
  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 DamithSL 370
1 Maciej Los 217
2 OriginalGriff 213
3 BillWoodruff 135
4 Zoltán Zörgő 85
0 OriginalGriff 7,953
1 DamithSL 6,139
2 Sergey Alexandrovich Kryukov 5,454
3 Maciej Los 5,293
4 Kornfeld Eliyahu Peter 4,539


Advertise | Privacy | Mobile
Web03 | 2.8.141223.1 | Last Updated 2 Sep 2014
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100