This is a migrated thread and some comments may be shown as answers.

Handling context menu client side

2 Answers 157 Views

Grid

This is a migrated thread and some comments may be shown as answers.

david asked on 19 Sep 2015, 05:56 PM

in the OnClientItemClicked event the clickedMenuItem is null and the hidden form field which is set in the RowContextMenu is null? Am i using the right event?

in RowContextMenu "hiddenClientID" is correctly set to the ClientID key field

// process content menu

function RowContextMenu(sender, eventArgs) {

var colIndex = eventArgs.get_domEvent().target.cellIndex;

var rowIndex = eventArgs.get_itemIndexHierarchical();

var masterTable = sender.get_masterTableView();

cell = masterTable.getCellByColumnUniqueName(masterTable.get_dataItems()[rowIndex], "ClientID");

var ClientID = cell.innerHTML; //

document.getElementById("hiddenClientID").value = ClientID;

var radGridClickedRowIndex = document.getElementById("hiddenClientID").value;

var menu = $find("<%=RadContextMenu1.ClientID %>");

var evt = eventArgs.get_domEvent();

if (evt.target.tagName == "INPUT" || evt.target.tagName == "A") {

return;

}

var index = eventArgs.get_itemIndexHierarchical();

sender.get_masterTableView().selectItem(sender.get_masterTableView().get_dataItems()[index].get_element(), true);

menu.show(evt);

evt.cancelBubble = true;

evt.returnValue = false;

if (evt.stopPropagation) {

evt.stopPropagation();

evt.preventDefault();

}

function contextMenuItemClicked(sender, args) {

var clickedMenuItem = args.get_item().get_value();

var radGridClickedRowIndex = document.getElementById("hiddenClientID").value;

var grid = $find('<%= RadGrid1.ClientID %>');

var masterTableView = grid.MasterTableView;

var row = masterTableView.get_dataItems()[radGridClickedRowIndex];

var cell = masterTableView.getCellByColumnUniqueName(row, "ClientID");

if (clickedMenuItem == "Edit") {

editClient();

}

if (clickedMenuItem == "Calendar") {

AddAppoint(cell.innerHTML);

}


<telerik:RadContextMenu ID="RadContextMenu1" runat="server" OnClientItemClicked="contextMenuItemClicked"             EnableRoundedCorners="true" EnableShadows="true" Skin="Metro">           
  <Items>                 <telerik:RadMenuItem Text="Select"    />                 <telerik:RadMenuItem Text="Calendar"    />                 <telerik:RadMenuItem Text="Contact" />                 <telerik:RadMenuItem Text="Edit" />                 <telerik:RadMenuItem Text="Payment" />                                 <telerik:RadMenuItem Text="Archive" />             </Items>         </telerik:RadContextMenu>

// process content menu function RowContextMenu(sender, eventArgs) { var colIndex = eventArgs.get_domEvent().target.cellIndex; var rowIndex = eventArgs.get_itemIndexHierarchical(); var masterTable = sender.get_masterTableView(); cell = masterTable.getCellByColumnUniqueName(masterTable.get_dataItems()[rowIndex], "ClientID"); var ClientID = cell.innerHTML; // get the lecturesID so it can be processed in the code behind document.getElementById("hiddenClientID").value = ClientID; // stuff it in a form variable so we can get inthe code behind var radGridClickedRowIndex = document.getElementById("hiddenClientID").value; var menu = $find("<%=RadContextMenu1.ClientID %>"); var evt = eventArgs.get_domEvent(); if (evt.target.tagName == "INPUT" || evt.target.tagName == "A") { return; } var index = eventArgs.get_itemIndexHierarchical(); sender.get_masterTableView().selectItem(sender.get_masterTableView().get_dataItems()[index].get_element(), true); menu.show(evt); evt.cancelBubble = true; evt.returnValue = false; if (evt.stopPropagation) { evt.stopPropagation(); evt.preventDefault(); } } function contextMenuItemClicked(sender, args) { var clickedMenuItem = args.get_item().get_value(); var radGridClickedRowIndex = document.getElementById("hiddenClientID").value; var grid = $find('<%= RadGrid1.ClientID %>'); var masterTableView = grid.MasterTableView; var row = masterTableView.get_dataItems()[radGridClickedRowIndex]; var cell = masterTableView.getCellByColumnUniqueName(row, "ClientID"); alert(clickedMenuItem); alert(cell); if (clickedMenuItem == "Edit") { editClient(); } if (clickedMenuItem == "Calendar") { AddAppoint(cell.innerHTML); } }

Handling context menu client side

2 Answers, 1 is accepted