Reputation: 11
i want to togle between 2 carts icon,one display when the cart is empty the second when is not,
<div id="div-icon-cart">
<span class="tools-icon">
<?php if ( ! WC()->cart->is_empty() ) { ?>
<img decoding="async" src="https://txxxx.com/uploads/cart.svg" class="custom-icon" alt="" height="20.738" width="17.626">
<?php } else{ ?>
<!-- begin snippet: js hide: false console: true babel: false -->
but the problem is that the cart icon doesn't change immediately,i need to refrech the page to upload cart icon. for that i tried to reload div which contains my cart icon
$document.ready(function(){
$('#div-icon-cart').load();
setInterval{fonction(){
$('#div-icon-cart').load();
},3000};
});
but doesn't work and i don't know why.i would be grateful for any help
NB:
Upvotes: 0
Views: 101
Reputation: 11
i tried this code
$(document).ready(function() {
setInterval(function() {
alert('tstt');
$('#div-cartIcon').load();
}, 3000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
the alert show up, but i when i make it after div Load doesn't diplay
$(document).ready(function() {
setInterval(function() {
$('#div-cartIcon').load();
alert('tstt');
}, 3000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
if anyone could explain why $('#div-cartIcon').load(); doesn't work
Upvotes: 0
Reputation: 148
Please replace jquery part to this.
$(document).ready(function(){
$('#div-icon-cart').load();
setInterval(function(){
$('#div-icon-cart').load();
},3000);
});
Upvotes: -1
Reputation:
You can use this code.
Please change your code like this.
$(document).ready(function(){
$('#div-icon-cart').load();
setInterval(function(){
$('#div-icon-cart').load();
},3000);
});
Upvotes: 0
Reputation:
Please try this code.
$(document).ready(function(){
$('#div-icon-cart').load();
setInterval(function(){
$('#div-icon-cart').load();
},3000);
});
Upvotes: 0
Reputation: 6109
It looks like the problem might just be some typos:
$document
should be $(document)
{fonction
should be (function
},3000};
should be },3000);
.load()
, not sure exactly$(document).ready(function() {
$('#div-icon-cart').load();
setInterval(function() {
$('#div-icon-cart').load();
}, 3000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="div-icon-cart">
<span class="tools-icon">
<?php if ( ! WC()->cart->is_empty() ) { ?>
<img decoding="async" src="https://txxxx.com/uploads/cart.svg" class="custom-icon" alt="" height="20.738" width="17.626">
<?php } else{ ?>
Upvotes: 2