Data-id do modal do bootstrap

[bruno93 0]

Boas!

Bem eu estou fazendo um tabela onde o utilizador vai poder alterar o campo que pretende e para isso estou a utilizar o modal do bootstrap.

Eu já consigo mandar a variável com sucesso para o modal do bootstrap mas só quando tenho só um data-id criado quando tenho vários data-id ele só manda a ultima criado será que alguém me pode ajuda a consertar isto.

<?php 
for ($i=0; $i < 3; $i++) 
{ 
    ?> 
    <button type="button" class="btn btn-primary btn-lg btnDelete" data-toggle="modal" data-target="#myModal" data-id="<?php echo $i; ?>">
      Launch demo modal
    </button>
    <?php
} 
?>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
      <p><?php echo $i;?></p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

Obrigo pela ajuda!

[Snowden 94]

<button type="button" class="btn btn-primary btn-lg btnDelete" data-toggle="modal" data-target="#myModal" date-id="1">

Open id 1</button>

<button type="button" class="btn btn-primary btn-lg btnDelete" data-toggle="modal" data-target="#myModal" date-id="2">

Open id 2</button>

<button type="button" class="btn btn-primary btn-lg btnDelete" data-toggle="modal" data-target="#myModal" date-id="3">

Open id 3</button>

var id = null;

$('button.btn').on('click', function(e){

id = $(this).attr('date-id');

});

// callback modal abre

$('#myModal').on('show.bs.modal', function(e){

alert('EDITAR ID: '+id);

});

[bruno93 0]

<button type="button" class="btn btn-primary btn-lg btnDelete" data-toggle="modal" data-target="#myModal" date-id="1">
Open id 1</button>
<button type="button" class="btn btn-primary btn-lg btnDelete" data-toggle="modal" data-target="#myModal" date-id="2">
Open id 2</button>
<button type="button" class="btn btn-primary btn-lg btnDelete" data-toggle="modal" data-target="#myModal" date-id="3">
Open id 3</button>

var id = null;
$('button.btn').on('click', function(e){
  id = $(this).attr('date-id');
});
// callback modal abre
$('#myModal').on('show.bs.modal', function(e){
    alert('EDITAR ID: '+id);
});

 

o que eu não consigo fazer é com que a <?php echo $i;?> tenha o mesmo id que o do button carregado

<div class="modal-body">
   <p><?php echo $i;?></p>
 </div>

aparece sempre o ultimo ID

[Snowden 94]

 

o que eu não consigo fazer é com que a <?php echo $i;?> tenha o mesmo id que o do button carregado

<div class="modal-body">
   <p><?php echo $i;?></p>
 </div>

aparece sempre o ultimo ID

 

isso por que o $i está fora do loop que consecutivamente trás o último.

 

essa interação de php com javascript cliente-side acho inapropriada, obtenha os ID atrás de uma requisição ajax retornando em JSON, replique os button setando o ID de dentro do loop só com JS

 

Agora.. no seu exemplo são criados 3 buttons (3 ids), para que iniciar o modal com o ID já setado nele? sendo que, de qualquer forma não seria o ID vindo do button clicado que será editado, excluido..etc?