Retirar ID de váriavel

[onurb22]

Boa tarde, 

estou a aprender e a educar-me a usar mais o JS. Estou a fazer um ficheiro com SORTABLE JS e queria usar um IF no onStart dependendo da informação contida na tag ID que tenho já guardado numa váriavel que saca a informação toda da DIV. Neste momento não sei como retirar qual a informação dentro da tag ID para fazer o meu IF.

o meu código dentro do onStart:

var info = evt.from;
console.log(info);

o que ele retorna:

Citação

<div id="caixa1" name="caixa1" class="list-group col">
  restante código
</div>

agora queria sacar o conteúdo do ID para fazer algo do genero IF var igual a caixa1 faz isto se for igual a caixa2 fazer aquilo...

 

Muito obrigado e desculpem o amadorismo

[Zex]

Podes enviar o código completo?

[onurb22]

var exp = document.getElementById('exp');
var caixa1 = document.getElementById('caixa1');
var caixa2 = document.getElementById('caixa2');

new Sortable(exp, {
	onStart: function(evt) {
      var caixa = evt.from;
      console.log(caixa);
      //Aqui quero fazer o if. Se a var caixa for Caixa 1 criar uma caixa na div caixa 1 se for caixa 2 criar uma div na caixa 2
      $('#caixa1').append('<input type="hidden" name="caixa[] "value="caixa1" id="caixa">');
      $('#caixa2').append('<input type="hidden" name="caixa[] "value="caixa2" id="caixa">');
  	},	
  	group: {
      name: 'shared',
      pull: 'clone',
      put: false,
    },
    animation: 150,
    sort: false 
});

new Sortable(caixa1, {
	onRemove: function(evt) {
    	var element = document.getElementById("caixa1");
        var child=document.getElementById("caixa");
        element.removeChild(child);
    },
    group: {
      name: 'shared',
	},
    animation: 150
  });

new Sortable(caixa2, {
	onRemove: function(evt) {
    	var element = document.getElementById("caixa1");
        var child=document.getElementById("caixa");
        element.removeChild(child);
    },
   	group: {
      name: 'shared'
    },
    animation: 150
 });

Basicamente o que quero é sempre que mexer um elemento do EXP para uma das caixas ele crie um campo invisivel com  o valor da caixa. Depois no HTML quando clicar no botao guardar ele diz quantos elementos do formulario ele tem na caixa 1 e na caixa 2. 

 

Talvez esteja a dar uma volta grande e confusa mas foi assim que cheguei a esta forma de gravar os valores na base de dados

[Zex]

evt.id dá o id "caixa1"

Edited March 27, 2021 at 07:19 PM by Zex

[onurb22]

a consola dá undefined se imprimir uma variavel com evt.id 😕

 

[Zex]

No exemplo que fiz funcionou.

É melhor mandares o ficheiro html para eu ver o teu exemplo.

Edited March 27, 2021 at 07:39 PM by Zex

[onurb22]

<!-- exp -->
<div class="col-md-2">
	<div class="card card-secondary">
    	<div class="card-header">
        	<h3 class="card-title">EXP</h3>
        </div>
        <div class="card-body">
        	<div id="exp" class="list-group col" name="exp">
            	<div class="list-group-item">
                	<input type="text" value="800" name="valor[]">
  				</div>
  				<div class="list-group-item">
                	<input type="text" value="800" name="valor[]">
  				</div>
  				<div class="list-group-item">
                	<input type="text" value="800" name="valor[]">
  				</div>
            </div>
      	</div>
	</div>
</div>
<!-- cx1 -->
<div class="col-md-2">
	<div class="card card-primary">
    	<div class="card-header">
        	<h3 class="card-title">Caixa 1</h3>
       	</div>
        <div class="card-body">
        	<div id="caixa1" name="caixa1" class="list-group col">
            </div>
      	</div>
  	</div>
</div>
<!-- cx2 -->
<div class="col-md-2">
	<div class="card card-primary">
    	<div class="card-header">
        	<h3 class="card-title">Caixa 2</h3>
      	</div>
        <div class="card-body">
        	<div id="caixa2" class="list-group col">
            </div>
        </div>
  	</div>
</div>

Obrigado 🙂

Edited March 27, 2021 at 08:03 PM by onurb22

[Zex]

Só costumo programar em javascript standard.

Assim, só posso analizar o programa se o ficheiro estiver completo.

Ora, falta qualquer coisa - assim não funciona.

Preciso da parte que falta e mais informação sobre como o programa deveria funcionar.

 

[onurb22]

Eu receio que não estejamos a falar do mesmo sortable. Mesmo testando no código base deles, eles não reconhecem evt.id 

https://jsbin.com/jayedig/edit?js,output

 

Basicamente o que eu quero é saber no onStart para que div mandei o objecto para poder fazer um IF para se for id caixa 1 imprimir caixa de texto com caixa1 se for id caixa 2 imprimir caixa de texto com caixa2

[Zex]

Já experimentaste evt.from.id  ?

[onurb22]

Funcionou 🙂 

estava na ideia que já tinha tentando. Na volta ainda não. Muito obrigado.