Bonjour à tous,

Je cherche un moyen pour ouvrir une fenêtre modal du framework Bootstrap et y afficher les données issues de ma table. Ma table est alimentée via une connexion MySQL. L'ouverture de ma fenêtre modal, est réalisée via un menu contextuel jQuery qui contient deux entrées : Editer et Supprimer.

Voici le code de mon menu contextuel :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<script type='text/javascript'>
window.onload=function(){
    $(function() {
        $(".context-menu-one").contextMenu({
            selector: 'td',
            callback: function(key, options) {
                switch (key) {
                    case 'edit':
                        var content = $(this).data('id');
                        $('#myModal').modal('show');
                        break;
 
                    case 'delete':
                      break;
                }
            },
            items: {
                "edit": {name: "Modifier", icon: "edit"},
                "delete": {name: "Supprimer", icon: "delete"},
            }
        });
        $('.context-menu-one').on('click', function(e){
            console.log('clicked', this);
        })
    });
}
</script>
Voici le code de ma fenêtre modal :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Test</h4>
      </div>
      <form class="my-form">
      <div class="modal-body">                                        
        <label>SDA
            <input type="text" id="sda" name="sda" value="" required="required" class="form-control col-md-7 col-xs-12">
        </label>
        <label>Service
        <input type="text" id="service" name="service" value="" required="required" class="form-control col-md-7 col-xs-12">
        </label>
        <label id="label-id"></label>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Clode</button>
        <button type="button" class="btn btn-primary" id="add">Add</button>
    </form>
      </div>
    </div>
  </div>
Voici le code PHP pour récupérer les données :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
  $reponse = $bdd->query("SELECT * FROM table");
    while ($donnees = $reponse->fetch()) {
 
        echo '
        <tr>
          <td data-id="'.$donnees[0].'">' . $donnees[1] . '</td>
          <td data-id="'.$donnees[0].'">' . $donnees[2]. '</td>
        </tr>
    ';
    }
Avez-vous une idée de la meilleure façon de procéder ?
Merci par avance,