Hallo iedereen,

Ik ben bezig aan een projectje waar ik graag een context menu zou hebben net zoals bijvoorbeeld dropbox heeft.

Momenteel heb ik een tabel met rijen die uit mijn mysql database worden gehaald:

PHP Code:

<?php do { ?>
<tr align="center" class="context-menu-one box menu-1">
<td width="32"><img src="/beheer/images/navigatie/klanten-hover.png" style="border: none;"/></td>
<td><a href="/beheer/klanten/<?php echo $row_rsKlanten['id']; ?>"><?php echo $row_rsKlanten['naam']; ?></a></td>
<td><?php echo $row_rsKlanten['c_voornaam'] .' '. $row_rsKlanten['c_naam'] ?></td>
<td><?php echo $row_rsKlanten['c_email'] ?></td>
<td><?php echo $row_rsKlanten['c_telefoon'] ?></td>
<td><a href="/beheer/klanten/verwijderen/<?php echo $row_rsKlanten['id']; ?>">verwijderen</a></td>
</tr>
<?php } while ($row_rsKlanten = mysql_fetch_assoc($rsKlanten)); ?>

Ik heb een scriptje gevonden via google waarmee ik dus als ik met mijn rechtermuisknop klik er een menu opent:

Code:

<script type="application/javascript">
        
        $(function(){
            $.contextMenu({
                selector: '.context-menu-one', 
                callback: function(key, options) {
                    
                    if(key == "bekijken") {                
                    window.location.href = 'klanten/ID';
                    }
                    if(key == "wijzigen") {                
                    window.location.href = 'klanten/wijzigen/ID';
                    }
                    if(key == "verwijderen") {                
                    window.location.href = 'klanten/verwijderen/ID';
                    }
                                        
                    window.console && console.log(m) || alert(m); 
                },
                items: {
                    "bekijken": {name: "Bekijken", icon: "cut"},
                    "wijzigen": {name: "Wijzigen", icon: "edit"},
                    "verwijderen": {name: "Verwijderen", icon: "delete"}
                }
            });
        });
        
        </script>

Het enige probleem dat ik nog heb is dat ik graag de database id, die in mijn tabel wordt weergegeven, zou willen gebruiken in mijn context menu. Zodat wanneer je in het menu klikt op bijvoorbeeld wijzigen je niet wordt doorgestuurd naar 'klanten/wijzigen/ID' maar effectief naar bijvoorbeeld 'klanten/wijzigen/2' als je op rij 2 van de tabel het menu hebt geopend.

Zou iemand mij hiermee kunnen helpen?

Alvast bedankt,
Michiel

Volgens mij moet het zoiets zijn, data-klantid attribute toevoegen en in javascript weer ophalen, heb het even snel geschreven nog niet getest.

PHP Code:

<?php do { ?>
<tr align="center" class="context-menu-one box menu-1" data-klantid="<?php echo $row_rsKlanten['id']; ?>">
<td width="32"><img src="/beheer/images/navigatie/klanten-hover.png" style="border: none;"/></td>
<td><a href="/beheer/klanten/<?php echo $row_rsKlanten['id']; ?>"><?php echo $row_rsKlanten['naam']; ?></a></td>
<td><?php echo $row_rsKlanten['c_voornaam'] .' '. $row_rsKlanten['c_naam'] ?></td>
<td><?php echo $row_rsKlanten['c_email'] ?></td>
<td><?php echo $row_rsKlanten['c_telefoon'] ?></td>
<td><a href="/beheer/klanten/verwijderen/<?php echo $row_rsKlanten['id']; ?>">verwijderen</a></td>
</tr>
<?php } while ($row_rsKlanten = mysql_fetch_assoc($rsKlanten)); ?>

Code:

<script type="application/javascript">
        
        $(function(){
            $.contextMenu({
                selector: '.context-menu-one', 
                callback: function(key, options) {
                    
                    if(key == "bekijken") {                
                    window.location.href = 'klanten/'+$(this).data('klantid');
                    }
                    if(key == "wijzigen") {                
                    window.location.href = 'klanten/wijzigen/'+$(this).data('klantid');
                    }
                    if(key == "verwijderen") {                
                    window.location.href = 'klanten/verwijderen/'+$(this).data('klantid');
                    }
                                        
                    window.console && console.log(m) || alert(m); 
                },
                items: {
                    "bekijken": {name: "Bekijken", icon: "cut"},
                    "wijzigen": {name: "Wijzigen", icon: "edit"},
                    "verwijderen": {name: "Verwijderen", icon: "delete"}
                }
            });
        });
        
        </script>

Origineel gepost door Michiel Kempen

Hallo iedereen,

Ik ben bezig aan een projectje waar ik graag een context menu zou hebben net zoals bijvoorbeeld dropbox heeft.

Momenteel heb ik een tabel met rijen die uit mijn mysql database worden gehaald:

PHP Code:

<?php do { ?>
<tr align="center" class="context-menu-one box menu-1">
<td width="32"><img src="/beheer/images/navigatie/klanten-hover.png" style="border: none;"/></td>
<td><a href="/beheer/klanten/<?php echo $row_rsKlanten['id']; ?>"><?php echo $row_rsKlanten['naam']; ?></a></td>
<td><?php echo $row_rsKlanten['c_voornaam'] .' '. $row_rsKlanten['c_naam'] ?></td>
<td><?php echo $row_rsKlanten['c_email'] ?></td>
<td><?php echo $row_rsKlanten['c_telefoon'] ?></td>
<td><a href="/beheer/klanten/verwijderen/<?php echo $row_rsKlanten['id']; ?>">verwijderen</a></td>
</tr>
<?php } while ($row_rsKlanten = mysql_fetch_assoc($rsKlanten)); ?>

Ik heb een scriptje gevonden via google waarmee ik dus als ik met mijn rechtermuisknop klik er een menu opent:

Code:

<script type="application/javascript">
        
        $(function(){
            $.contextMenu({
                selector: '.context-menu-one', 
                callback: function(key, options) {
                    
                    if(key == "bekijken") {                
                    window.location.href = 'klanten/ID';
                    }
                    if(key == "wijzigen") {                
                    window.location.href = 'klanten/wijzigen/ID';
                    }
                    if(key == "verwijderen") {                
                    window.location.href = 'klanten/verwijderen/ID';
                    }
                                        
                    window.console && console.log(m) || alert(m); 
                },
                items: {
                    "bekijken": {name: "Bekijken", icon: "cut"},
                    "wijzigen": {name: "Wijzigen", icon: "edit"},
                    "verwijderen": {name: "Verwijderen", icon: "delete"}
                }
            });
        });
        
        </script>

Het enige probleem dat ik nog heb is dat ik graag de database id, die in mijn tabel wordt weergegeven, zou willen gebruiken in mijn context menu. Zodat wanneer je in het menu klikt op bijvoorbeeld wijzigen je niet wordt doorgestuurd naar 'klanten/wijzigen/ID' maar effectief naar bijvoorbeeld 'klanten/wijzigen/2' als je op rij 2 van de tabel het menu hebt geopend.

Zou iemand mij hiermee kunnen helpen?

Alvast bedankt,
Michiel