CODEWITHSUNDEEP
javascriptphpjquery
php777
php777

Reputation: 21

jquery - hide not working

By clicking on "empty cart?", I am unsetting the cart array which is working fine. Now I wanted another form to be hidden if this "empty cart" button is clicked.

html:

<form id="f1" action="checkout.php" method="post">
    <input name="cust_login" type="submit" value="Continue" />
</form>    
<br>
<button><a href = "cart.php?cmd=emptycart">empty cart?</a></button>

javascript:

 <script>
 $(document).ready(function(){
     $("button").click(function(){
        $("#f1").hide();
     });
 });
 </script>

php code for unsetting array:

if (isset($_GET['cmd']) && $_GET['cmd'] == "emptycart") {
 unset($_SESSION["cart_array"]);

But hide is not working here.

My question is, can we use button and link together as I have written ? If not, then how to implement it?

Upvotes: 2

Views: 159

Answers (4)

Shouvik
Shouvik

Reputation: 447

You can try this solution

HTML

<form id="f1" action="checkout.php" method="post">
  <input name="cust_login" type="submit" value="Continue" />
  </form>    
<br>
<button>empty cart?</button>

JS

 $(document).ready(function(){
   $("button").click(function(){
     //$("#f1").hide();
     window.location.href = "cart.php?cmd=emptycart";
   });
});

Upvotes: 0

Yatin Khullar
Yatin Khullar

Reputation: 1590

Try to use this:

$(document).ready(function(){
  var cmd = '<?php echo $_GET["cmd"] ;?>' ;
  if(cmd == "emptycart")
  {
     $("#f1").hide();
  }
});

Upvotes: 1

Vasiliy vvscode Vanchuk
Vasiliy vvscode Vanchuk

Reputation: 7169

<form id="f1" 
      action="checkout.php" 
      style="<?= (isset($_SESSION['cart_array']) && count($_SESSION['cart_array']))? "display:none;": ""; ?>" 
      method="post">
    <input name="cust_login" type="submit" value="Continue" />
</form>    
<br>
<button><a href = "cart.php?cmd=emptycart">empty cart?</a></button>

On rendering form - check if cart is empty - render it on hidden state

But in this case your js code had no sense. So you can add 

<script>
 $(document).ready(function(){
     $(document).on('click', "a[href='cart.php?cmd=emptycart']", function(ev){
       ev.preventDefault();
       $.get($(this).attr('href', function() {
         $("#f1").hide();
       });
     });
 });
 </script>

Istead of your js code - this one prevent page reload ( which happens when you click on link ) and send request via AJAX

Upvotes: 0

Dusty
Dusty

Reputation: 364

You can try 

 $(document).ready(function(){
 $("button").click(function(){
    $("#f1").attr('style','display: block !important')
  });
 });

or to add a class to style file that do the same and then just add this class when clicking on the button.

Upvotes: 0

Related Questions