javascript - custom - Habilitar el elemento jQuery contextMenu en la solicitud ajax

jquery contextmenu github

Question

Estoy tratando de actualizar el elemento contextmenu si las solicitudes ajax alteran mi contenido div.

Esto es lo que quiero decir Tengo un div como este:

<div id="" class="message" data-options=''{"update":"YES", "delete":"NO">
</div>

Y parte del menú de contexto jquery (esto ocurre solo una vez cuando el cuerpo se carga):

$.contextMenu({
        selector: ''.message'', 
        trigger: ''left'',
        callback: function(key, options) {
            var m = "clicked: " + key;
            window.console && console.log(m) || alert(m); 
        },
        items: {
            "update": {
                name: "Update",
                disabled: function(key, opt) { 
                    return (this.data("options").update === "NO")
                },
            },
            "delete": {
                name: "Delete", 
                 disabled: function(key, opt) { 
                    return (this.data("options").delete=== "NO")
                }
           //etc. rest of the code

Estoy buscando volver a crearlo cuando se produzca alguna solicitud ajax o desactivar / habilitar elementos de alguna manera

Así que ahora suceden algunas solicitudes de Ajax y, con éxito, intento actualizar la div.message data-option div.message porque considero habilitar / deshabilitar botones como este:

In ajax.success function :
- disable or enable menu items 

--------Actually--------Simplified

En realidad, esta pregunta / respuesta es muy similar a mi problema actual:

Deshabilitar y habilitar el menú contextual jQuery

Quiero habilitar / deshabilitar el elemento contextMenu en un clic de botón, si pudiera hacerlo en este ejemplo ficticio creo que podría manejar la solicitud de ajax también.

Answer 1

Utilicé la opción de build para agregar nuevos elementos, puede ver que puede hacer con los elementos aquí lo que quiera: http://jsfiddle.net/oceog/Tvv4P/1/

HTML:

<div class="context-menu-one box menu-1">
    <strong>right click me</strong>
</div>

<button id="add"> Add item</button>
<button id="disable_cut"> Disable cut</button>
<button id="enable_cut"> enable cut</button>
​

JS:

$.contextMenu({
    selector: ''.context-menu-one'',
    build: function($trigger, e) {
        console.log(e);
        return {
            callback: function(key, options) {
                var m = "clicked: " + key;
                console.log(m);
                //window.console && console.log(m) || alert(m); 
            },
            items: items
        };
    }
});
var 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: "quit"
    }};
var newitemN=0;
$(''#add'').click(function() {
            var newitem={};
        newitem[''newitem_''+newitemN]={
            name: ''new item #''+newitemN,
            icon: "copy"
        };
   newitemN++;
   $.extend(items,newitem);
});

$(''#disable_cut'').click(function() {
    items.cut.disabled=true;
});

$(''#enable_cut'').click(function() {
    items.cut.disabled=false;
});