Probablemente conseguiré votos negativos para esta pregunta, pero. aquí va.
Estoy usando tablas de datos. ¿Es posible mostrar los botones de edición y eliminación en funcionamiento al hacer clic con el botón derecho como en el ejemplo aquí ? No soy bueno en jquery. Agradecería si alguien puede enviar una muestra. El único ejemplo de trabajo que encontré es este . Pero no es lo que estoy tratando de lograr.
Ejemplo de eventos de clic: https://datatables.net/examples/advanced_init/events_live.html
Aquí está la modificación del javascript utilizado en su primer ejemplo:
$(document).ready( function () { var oTable = $('#example').dataTable({ "bJQueryUI": true, "sDom": 'l<"H"Rf>t<"F"ip>' }); $(document).contextmenu({ delegate: ".dataTable td", menu: [ {title: "Delete", cmd: "delete"}, {title: "Edit", cmd: "edit"} ], select: function(event, ui) { switch(ui.cmd){ case "delete": $(ui.target).parent().remove(); break; case "edit": $(ui.target).html( $('<input type="text"/>').val( $(ui.target).text() ).bind( "keypress focusout",function (e) { if (e.type=="keypress"?(e.keyCode ==13?true:false):true) { $(this).parent().html( $(this).val() ); } }) ); break; } }, beforeOpen: function(event, ui) { var $menu = ui.menu, $target = ui.target ui.menu.zIndex(0); } }); } );El ejemplo de trabajo se ha publicado aquí:
Puede iniciar el menú contextual en el controlador drawCallback y recuperar la id de la fila en la que se hizo clic en la devolución de llamada de $.contextMenu :
drawCallback : function() { $.contextMenu({ selector: 'tbody tr td', callback: function(key, options) { var id = options.$trigger[0].parentElement.id; var m = "clicked: " + key + ' ' + id; window.console && console.log(m) || alert(m); /* switch (key) { case 'delete' : yourDeleteMethod(id); break; case 'edit' : yourEditMethod(id); break; ... } */ }, items: { "edit": {name: "Edit", icon: "edit"}, "cut": {name: "Cut", icon: "cut"}, copy: {name: "Copy", icon: "copy"}, "paste": {name: "Paste", icon: "paste"}, "delete": {name: "Delete", icon: "delete"}, "sep1": "---------", "quit": {name: "Quit", icon: function(){ return 'context-menu-icon context-menu-icon-quit'; }} } }); },violín actualizado -> http://jsfiddle.net/0f9Ljfjr/900/
Dado que el selector está configurado en tbody tr td , la id siempre se podrá encontrar mediante options.$trigger[0].parentElement.id . Ahora solo necesita responder a las acciones que necesite y llamar a sus propios métodos con la id recuperada.