<?php 

<div>

    <div id="gamb_act" class="bloc1">

        <h3>Gambits actifs</h3>

         <ul class="sortabledemo" id="firstlist">

               <li class="green" id="firstlist_firstlist1">Gambit n°14</li>

               <li class="green" id="firstlist_firstlist2">Gambit n°1</li>

               <li class="green" id="firstlist_firstlist3">Gambit n°11</li>

               <li class="green" id="firstlist_firstlist4">Gambit n°10</li>

               <li class="green" id="firstlist_firstlist5">Gambit n°15</li>

               <li class="green" id="firstlist_firstlist6">Gambit n°7</li>

               <li class="green" id="firstlist_firstlist7">Gambit n°21</li>

               <li class="green" id="firstlist_firstlist8">Gambit n°12</li>

         </ul>

    </div>

     <div id="gamb_pass"  class="bloc1">

         <h3>Gambits de réserve</h3>

         <ul class="sortabledemo" id="secondlist">

               <li class="orange" id="secondlist_secondlist1">

                 <span class="handle">Gambit n°9</span>

               </li>

               <li class="orange" id="secondlist_secondlist2">

                 <span class="handle">Gambit n°8</span>

               </li>

               <li class="orange" id="secondlist_secondlist3">

                 <span class="handle">Gambit n°0</span>

               </li>

               <li class="orange" id="secondlist_secondlist4">

                 <span class="handle"  >Gambit n°13</span>

               <li class="orange" id="secondlist_secondlist5">

                 <span class="handle">Gambit n°2</span>

               <li class="orange" id="secondlist_secondlist6">

                 <span class="handle">Gambit n°3</span>

               </li>

         </ul>

    </div>

</div>



<div style="clear:both;"> </div>



{literal}

 <script type="text/javascript">

 // <![CDATA[

   Sortable.create("firstlist",

     {dropOnEmpty:true,containment:["firstlist","secondlist"], constraint:false, 

      onChange:function(){calculnbGambits('firstlist', 'gamb_act');}});

    

   Sortable.create("secondlist",

     {dropOnEmpty:true,handle:'handle',containment:["firstlist","secondlist"],constraint:false});

 // ]]>

 </script>

{/literal} 

<?php 

function calculnbGambits(id_entree, id_container)

{

    var e=$(id_entree).immediateDescendants(); 

    if (e.size() > 10)

    {

        //C'est ici que je dois faire en sorte que mes éléments repartent d'où ils viennent

    }

} 

<?php 

function calculnbGambits(id_entree, id_container)

{

    var e=$(id_entree).immediateDescendants(); 

    if (e.size() > 10)

    {

        Sortable.destroy('seconlist');

        Sortable.create("secondlist",

{dropOnEmpty:true,handle:'handle',containment:["firstlist","secondlist"],constraint:false, only='actif'});

    

    }

} 

<?php 

var sortablesState = 0;

function initSortables() {

  // state = 0 => interdit

  // state = 1 => autorisé

  var nbActive = $('firstlist').immediateDescendants().size();

  // si interdit et moins de 10 éléments, alors autoriser

  if (sortablesState == 0 && nbActive < 10) {

    // supprimer les Sortables s'il y en a

    if (Sortable.options("firstlist")) {

      Sortable.destroy("firstlist");

    }

    if (Sortable.options("secondlist")) {

      Sortable.destroy("secondlist");

    }

    // Créer les sortables en autorisant les mouvements des deux côtés

    Sortable.create("firstlist",

      {dropOnEmpty:true,containment:["firstlist","secondlist"], constraint:false, onUpdate:initSortables});

    Sortable.create("secondlist",

      {dropOnEmpty:true,handle:'handle',containment:["firstlist","secondlist"],constraint:false});

    // Passer l'état à "autorisé"

    sortablesState = 1;

  }

  // si autorisé et au moins 10 éléments, alors interdire

  else if (sortablesState == 1 && nbActive >= 10) {

    // Supprimer les Sortable

    Sortable.destroy("firstlist");

    Sortable.destroy("secondlist");

    // Créer les Sortable en limitant les mouvements

    Sortable.create("firstlist", 

      {dropOnEmpty:true, containment:["firstlist"], constraint:false, onUpdate:initSortables});

    Sortable.create("secondlist", 

      {dropOnEmpty:true, containment:["firstlist","secondlist"], constraint:false});

    // Passer à l'état "interdit"

    sortablesState = 0;

  }

}

// Initialisation des sortables : on appelle la fonction générique

initSortables();