[Resolvido] pegar o atributo da div arrastada com jquery sortable

[luan_alves 3]

bom dia

estou com uma duvida que é a seguinte, estou usando o sortable da jquery ui, porem eu gostaria de pegar o id da div que foi substituida, por exemplo eu arrastei a div id=1 para o lugar da div id=2, eu gostaria de pegar o id da div=2, eu já consegui pegar o valor de qual esta sendo arrastada, conforme o codigo abaixo.

 

$j( "#videoPrincipal2" ).sortable({
       axis: "x",// eixo vertical ou horizontal
     cursor: "move",
           stop : function (event, ui) { 
           var order1 = $j(ui.sender).attr('id'); //div que foi manipulada
           alert(order1);
           }
   });

<div id="videoPrincipal2">
                   <div id="video1"></div> <div id="video2"></div> <div id="video3"></div> <div id="video4"></div>
               </div>

[luan_alves 3]

Boa tarde

A todos que tentaram me ajudar, como eu achei a resposta estou postanto aqui a mesma!

na verdade trata-se do evento que será manipulado, no meu exemplo eu utilizo o evento update, pois eu quero pegar todos os dados que acabaram de ser arrastados, no meu caso eu pego as posições atuais pelo

new_position = $j(this).sortable('toArray');

, e ai com os ids das div's eu faço um for para pegar os dados que eu quero, se algum de voces estivem afim de pegar os mesmos dados antes do update, é só mudar o evento para start:, mas algumas duvidas procurem sobre o evento da jquery ui sortable no proprio site!

function sortable()
{
   $j( "#videoPrincipal2" ).sortable({
       axis: "x",// eixo vertical ou horizontal
     //placeholder: 'ui-state-highlight',
   update: function(event, ui) { // novas posições
       var arquivos=" ";var entry=" ";
       var new_position = $j(this).sortable('toArray');
       for (var i = 0; i < new_position.length; i++) {
           entry = '#'+new_position[i];
           arquivos+= "video"+[i+1]+""+">"+
          $j(entry).find('img').attr('alt')+">"+//title
          $j(entry).find('img').attr('src')+">"+//imagem
          $j(entry).find('img').attr('name')+"*";//url
       }
       alert(arquivos)
      $j('#CarregaLoading').css('display','block');
           $j.post('model/cadastraVideos.php',{arquivos:arquivos},function(retorno){
               alert(retorno);
               $j('#CarregaLoading').css('display','none');
           })
       }
   });
   $j( "#videoPrincipal2" ).disableSelection();
}

[JCMais 75]

Obrigado por compartilhar o código #luan_alves, eu tenho uma pequena (mais de grande valia) recomendação para você.

Aqui:

            entry = '#'+new_position[i];
           arquivos+= "video"+[i+1]+""+">"+
          $j(entry).find('img').attr('alt')+">"+//title
          $j(entry).find('img').attr('src')+">"+//imagem
          $j(entry).find('img').attr('name')+"*";//url

 

Você poderia efetuar a cache do elemento entry, assim evitava ter que requisitar o mesmo no dom três vezes seguidas. E ainda mais adiante, você poderia efetuar a cache logo das imagens, visto que somente está mechendo nelas, logo seu código poderia ficar assim:

           var $entryImgs = $j('#'+new_position[i]).find('img');
          arquivos += "video"+[i+1]+""+">" + 

          $entryImgs.attr('alt')+">"+//title
          $entryImgs.attr('src')+">"+//imagem
          $entryImgs.attr('name')+"*";//url

 

Outra coisa é que você está definindo a variável entry como global, pois não usou var.

[luan_alves 3]

JCMais - FLF

po cara valeu mesmo pela a dica, irei colocar em meu código