akram
akram

Reputation: 11

Can i reload div automaticly without click events?

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

Answers (5)

akram
akram

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

Hu Zhi Xing
Hu Zhi Xing

Reputation: 148

Please replace jquery part to this.

  $(document).ready(function(){
        $('#div-icon-cart').load();
        setInterval(function(){
            $('#div-icon-cart').load();
        },3000);
  });

Upvotes: -1

user16526556
user16526556

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

user17609480
user17609480

Reputation:

Please try this code.

 $(document).ready(function(){
        $('#div-icon-cart').load();
        setInterval(function(){
            $('#div-icon-cart').load();
        },3000);
  });

Upvotes: 0

Solomon Ucko
Solomon Ucko

Reputation: 6109

It looks like the problem might just be some typos:

  • $document should be $(document)
  • {fonction should be (function
  • },3000}; should be },3000);
  • there seems to be something wrong with .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

Related Questions