在ajax请求上启用jQuery contextMenu项 [英] Enabling jQuery contextMenu item on ajax request

问题描述

我正在尝试更新 contextmenu 项目，如果ajax请求改变我的div内容。

I'm trying to update contextmenu item if ajax requests alters my div content.

这就是我的意思我有这样的div：

Here is what I mean I have a div like this :

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

和上下文菜单jquery部分（这在身体加载时只发生一次）：

And context Menu jquery part (this happens only once when body loads):

$.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

我想在一些ajax请求时重新创建它以某种方式添加或禁用/启用项目

I'm looking to re-create it when some ajax request happens or disable/enable items somehow

所以现在一些ajax请求发生并且成功时我正在尝试更新 div.message data-option 因为我启用/禁用这样的按钮：

So now some ajax requests happen and on success I'm trying to update div.message data-option because I though of enabling/disabling buttons like this :

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

--------其实--------简化

其实这个问题/答案与我目前的问题非常相似：

Actually this question/answer is very similar to my current issue :

禁用并启用jQuery上下文菜单

我想在某些按钮点击上启用/禁用contextMenu项目，如果我能够在这个虚拟对象中执行例如我认为我也可以处理ajax请求。

I want to enable/disable contextMenu item on some button click, if I were able to do in this dummy example I think I could handle ajax request as well.

推荐答案

我用 build 添加新项目的选项，你可以看到你可以随意使用任何你想要的项目： http://jsfiddle.net/oceog/Tvv4P/1/

I used build option to add new items, you can see that you can do with items here whatever you want: 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;
});

这篇关于在ajax请求上启用jQuery contextMenu项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！