未指定项目-带有动态项目的Contextmenu

时间:2019-07-17 07:23:22

标签: javascript php jquery json

我有一个简单的页面,其中显示了使用数据表的呼叫中心队列,并使用contextmenu(委托给此数据表)来指定呼叫中心代理到队列中的呼叫。到目前为止,在SO的帮助下,我想到的所有东西都可以正常工作。但是,问题在于,右键单击控制台日志时显示“未指定任何项目”。是的,他们是...有人可以帮我向我展示我犯了致命错误的地方..?

ActiveList中的数据是仅包含{“ Agent”:“ Mario”}等的JSON结果(数组)。因此,我已经尝试将ri.agent分配给结果,但这没有用。

   // Call the dataTables jQuery plugin - SQL Server Wachtrij view.

   $(document).ready(function() {
   var table =  $('#dataTable').dataTable(
   {
    "bPaginate": false,
    "bFilter": false,
    "bInfo": false,
    "bProcessing": false,
    "sAjaxSource": "wachtrij.php",
    "aoColumns": [
          { mData: 'callcenter' } ,
          { mData: 'Tijdstip_binnengekomen' },
          { mData: 'Wachttijd'},
          { mData: 'telefoonnummer'},
          { mData: 'Wachtrij_Positie'},
          { mData: 'callid'},
              {"defaultContent":'<button 
class="btn">Toewijzen aan Agent</button>'}
        ],    
        })

// Make sure dataTable refreshes every 5 seconds 

setInterval( function () {
    table.api().ajax.reload();
}, 5000 );

$.contextMenu({
selector: '#dataTable td',
trigger: 'right',
build: function ($trigger, e)
{
    // check if the menu-items have been saved in the previous call
    if ($trigger.data("contextMenuItems") != null)
    {
        // get options from $trigger
        var options = $trigger.data("contextMenuItems");

        // clear $trigger.data("contextMenuItems"),
        // so that menuitems are gotten next time user does a rightclick 
        // from the server again.
        $trigger.data("contextMenuItems", null);
        return options;
    }
    else
    {
        var options = {
            callback: function (key)
            {
                alert(key);
            },
            items: {}
        };
        $.ajax({
            method: "GET",
            url: "ActiveList.php",
            "aoColumns": [
          { aData: 'agent' }
        ],
        success: function (response, status, xhr)
            {
                // for each menu-item returned from the server
                for (var i = 0; i < response.length; i++)
                {
                    var ri = response[i];
                    // save the menu-item from the server in the 
options.items object
                    options.items[ri.id] = ri;
                }
                // save the options on the table-row;
                $trigger.data("contextMenuItems", options);

                // open the context-menu (reopen)
                $trigger.contextMenu();
            },
            error: function (response, status, xhr)
            {
                if (xhr instanceof Error)
                {
                    alert(xhr);
                }
                else
                {

alert($($.parseHTML(response.responseText)).find("h2").text());
                }
            }
        });
        // This return false here is important                
        return false;
    }
   }

 });

});

1 个答案:

答案 0 :(得分:0)

尝试了另一种对我有用的方法。我以为不用使用“ Build”,而是可以在调用ContextMenu之前创建一个数组,并在函数本身中使用它。奇迹般有效。使用表刷新代理列表将在以后添加。

 // Call the dataTables jQuery plugin - SQL Server Wachtrij view.

  $(document).ready(function() {
  var table =  $('#dataTable').dataTable(
  {
    "bPaginate": false,
    "bFilter": false,
    "bInfo": false,
    "bProcessing": false,
    "sAjaxSource": "wachtrij.php",
    "aoColumns": [
          { mData: 'callcenter' } ,
          { mData: 'Tijdstip_binnengekomen' },
          { mData: 'Wachttijd'},
          { mData: 'telefoonnummer'},
          { mData: 'Wachtrij_Positie'},
          { mData: 'callid'}
        ],    
        })

 // Make sure dataTable refreshes every 5 seconds 

setInterval( function () {
        table.api().ajax.reload();
    }, 5000 );

 $(function(){

// Get agentdata from server

var request = new XMLHttpRequest()

request.open('GET', 'ActiveList.php', true)
request.onload = function() {
var data = JSON.parse(this.response)

// create array from http call 

var menuitems = [];
$.each(data, function( key, value ) {
   menuitems[key] =  { name: value.agent, icon: "checkmark", onclick: function () { 
RToTb(array_name) }};
});

//create the contextmenu using the array as menuitems

$.contextMenu({
selector: '#dataTable td',
trigger: 'left',
items: menuitems
  });

  }
//Send the request

  request.send()    

  });

 });