Yii Framework Forum: Appels Ajax Multiples Sur Une Même Action - Yii Framework Forum

Jump to content

Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Appels Ajax Multiples Sur Une Même Action Problème inattendu lors d'appels multiples Ajax sur une même actio Rate Topic: -----

#1 User is offline   alcam 

  • Newbie
  • Yii
  • Group: Members
  • Posts: 3
  • Joined: 05-March 14

Posted 11 April 2014 - 11:57 AM

Bonjour,

Je rencontre un problème d'utilisation d'appels multiples Ajax sur une même action. Je ne comprends pas ce qui se passe. Pouvez-vous m'aider ? J'ai créé un exemple réduit au minimum ci-dessous.

Voilà, il y a une liste de noms cliquables. Lorsqu'on clique un nom, celui-ci devient rouge (ajout de la classe CSS "red_item"), un appel Ajax se déclenche qui tourne pendant quelques secondes, et au retour la classe red_item est enlevée de l'élément. Normalement, en cliquant sur chaque élément à 2 secondes d'intervalle par exemple, les éléments rouges devraient redevenir à leur couleur initiale progressivement à la même fréquence. Or tous les éléments retournent à leur état initial en même temps, comme si la fin du 1er appel Ajax terminait les autres ou que l'action du contrôleur n'était pas réentrante...

Contrôleur :
<?php
class SiteController extends Controller {
  public function actionError() {
    if($error=Yii::app()->errorHandler->error) {
      if(Yii::app()->request->isAjaxRequest) echo $error['message'];
      else $this->render('error', $error);
    }
  }

  public function actionIndex() { $this->render( 'index' ); }

  public function actionTestAjax() { for( $i = 0 ; $i < 10000000 ; $i++ ); }
}


Vue "index" :
<style>.red_item {color:red;}</style>
<ul>
  <li><span id="name_1" class="clickable">Item 1</span></li>
  <li><span id="name_2" class="clickable">Item 2</span></li>
  <li><span id="name_3" class="clickable">Item 3</span></li>
</ul>

<script>
  function onItemClick ( $target ) {
    $target.addClass( 'red_item' );
    $.ajax( {
      url: "<?php echo $this->createUrl( 'site/testAjax', array() ); ?>",
      complete: function() {
        $target.removeClass( 'red_item' );
      }
    } );
  };

  $( document ).ready( function () {
    $( '.clickable' ).on( "click", function( $event ) {
      onItemClick( $( this ) );
    });
  });
</script>


Par contre, le code suivant fonctionne (chaque item appelle en Ajax sa propre action) :
Contrôleur :
public function actionTestAjax() { for( $i = 0 ; $i < 10000000 ; $i++ ); }
public function actionTestAjax2() { for( $i = 0 ; $i < 10000000 ; $i++ ); }
public function actionTestAjax3() { for( $i = 0 ; $i < 10000000 ; $i++ ); }


Vue "index" :
<style>.red_item {color:red;}</style>
<ul>
  <li><span id="name_1" class="clickable">Item 1</span></li>
  <li><span id="name_2" class="clickable">Item 2</span></li>
  <li><span id="name_3" class="clickable">Item 3</span></li>
</ul>

<script>
  function onItemClick ( $target ) {
    $target.addClass( 'red_item' );
    $.ajax( {
      url: "<?php echo $this->createUrl( 'site/testAjax', array() ); ?>",
      complete: function() { $target.removeClass( 'red_item' ); }
    } );
  };

  function onItemClick2 ( $target ) {
    $target.addClass( 'red_item' );
    $.ajax( {
      url: "<?php echo $this->createUrl( 'site/testAjax2', array() ); ?>",
      complete: function() { $target.removeClass( 'red_item' ); }
    } );
  };

  function onItemClick3 ( $target ) {
    $target.addClass( 'red_item' );
    $.ajax( {
      url: "<?php echo $this->createUrl( 'site/testAjax3', array() ); ?>",
      complete: function() { $target.removeClass( 'red_item' ); }
    } );
  };

  $( document ).ready( function () {
    $( '#name_1' ).on( "click", function( $event ) { onItemClick( $( this ) ); });
    $( '#name_2' ).on( "click", function( $event ) { onItemClick2( $( this ) ); });
    $( '#name_3' ).on( "click", function( $event ) { onItemClick3( $( this ) ); });
  });
</script>


Merci
0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users