Context Menu in Grid with the columns fixed

NGUYEN VIET THANH posted over 3 years ago

Hello,
I tried to create a menu context in a grid if we select and right click on a cell.
But it worked on cells of fixed columns, not with those of non-fixed columns.
Could you help me please ?
My Infragistics version is 14.2
Below is my grid and code:

@(Html.Infragistics()
.Grid<ViewPlanningProd>()
.ID("gridPlanningProd")
.Height((string)ViewBag.HeightList)
.Width("1800px")
.ResponseDataKey("Data") //pointe sur la propriété Data de PagedDataListDto
.PrimaryKey("PrimaryKey")
.RenderCheckboxes(true)
.AutoGenerateColumns(false)
.AutoGenerateLayouts(false)
.EnableUTCDates(false)
.Columns(column =>
{

column.For(crp => crp.LigneMachine).Width("100px");
column.For(crp => crp.RefProduit).Width("100px");
column.For(crp => crp.Po).Width("100px");
column.For(crp => crp.QteCde).Width("100px");
column.For(crp => crp.Designation).Width("200px");
column.For(crp => crp.QteEq).Width("80px").Template(Html.TemplateAttributes(new { @style = Style.AlignCenter }, "${QteEq}") + Html.TemplateAttributes(new { @style = Style.AlignCenterRedNewLine }, "(${QteEq2})")).Format("#"); ;
column.For(crp => crp.NbrPersonne).Width("50px");
column.For(crp => crp.Commentaire).Width("200px");

//column.MultiColumnHeader().HeaderText("Lundi").Group(c =>
//{
// c.For(crp => crp.LundiJournee).Width("100px");
// c.For(crp => crp.LundiMatin).Width("100px");
// c.For(crp => crp.LundiApresMidi).Width("100px");
// c.For(crp => crp.LundiNuit).Width("100px");
//});

column.MultiColumnHeader().HeaderText("Mardi").Group(c =>
{
c.For(crp => crp.MardiJournee).Width("100px");
c.For(crp => crp.MardiMatin).Width("100px");
c.For(crp => crp.MardiApresMidi).Width("100px");
c.For(crp => crp.MardiNuit).Width("100px");
});

column.MultiColumnHeader().HeaderText("Mercredi").Group(c =>
{
c.For(crp => crp.MercrediJournee).Width("100px");
c.For(crp => crp.MercrediMatin).Width("100px");
c.For(crp => crp.MercrediApresMidi).Width("100px");
c.For(crp => crp.MercrediNuit).Width("100px");
});

column.MultiColumnHeader().HeaderText("Jeudi").Group(c =>
{
c.For(crp => crp.JeudiJournee).Width("100px");
c.For(crp => crp.JeudiMatin).Width("100px");
c.For(crp => crp.JeudiApresMidi).Width("100px");
c.For(crp => crp.JeudiNuit).Width("100px");
});

column.MultiColumnHeader().HeaderText("Vendredi").Group(c =>
{

c.For(crp => crp.VendrediJournee).Width("100px");
c.For(crp => crp.VendrediMatin).Width("100px");
c.For(crp => crp.VendrediApresMidi).Width("100px");
c.For(crp => crp.VendrediNuit).Width("100px");
});

column.MultiColumnHeader().HeaderText("Samedi").Group(c =>
{
c.For(crp => crp.SamediJournee).Width("100px");
c.For(crp => crp.SamediMatin).Width("100px");
c.For(crp => crp.SamediApresMidi).Width("100px");
c.For(crp => crp.SamediNuit).Width("100px");
});

column.MultiColumnHeader().HeaderText("Dimanche").Group(c =>
{
c.For(crp => crp.DimancheJournee).Width("100px");
c.For(crp => crp.DimancheMatin).Width("100px");
c.For(crp => crp.DimancheApresMidi).Width("100px");
c.For(crp => crp.DimancheNuit).Width("100px");
});

column.For(a => a.PrimaryKey).Hidden(true);
})
.Features(features =>
{
features.Selection().Mode(SelectionMode.Cell).MultipleSelection(false);
//features.Updating().EnableAddRow(false).EnableDeleteRow(false);
//features.RowSelectors();
features.ColumnFixing().FixingDirection(ColumnFixingDirection.Left).ColumnSettings(cs =>
{
cs.ColumnSetting().ColumnKey("LigneMachine").IsFixed(true);
cs.ColumnSetting().ColumnKey("RefProduit").IsFixed(true);
cs.ColumnSetting().ColumnKey("Po").IsFixed(true);
cs.ColumnSetting().ColumnKey("QteCde").IsFixed(true);
cs.ColumnSetting().ColumnKey("Designation").IsFixed(true);
cs.ColumnSetting().ColumnKey("QteEq").IsFixed(true);
cs.ColumnSetting().ColumnKey("NbrPersonne").IsFixed(true);
cs.ColumnSetting().ColumnKey("Commentaire").IsFixed(true);
});
features.Sorting().Type(OpType.Remote).ColumnSettings(cs =>
{
cs.ColumnSetting().ColumnKey("LigneMachine").CurrentSortDirection("asc");
});
features.Paging().Type(OpType.Remote)
.PageSize(ViewBag.PageSize)
.PageSizeList(ViewBag.PageSizeList)
.RecordCountKey("TotalDataCount"); //pointe sur la propriété TotalDataCount de PagedDataListDto
features.Filtering().Type(OpType.Remote).Mode(FilterMode.Simple)
.FilterExprUrlKey(string.Empty); // ne pas oublier de mettre la ExpUrlKey à empty sans quoi le décryptage oData ne fonctionne pas
features.Tooltips().Visibility(TooltipsVisibility.Always)
.CursorLeftOffset(15).Style(TooltipsStyle.Tooltip).ShowDelay(100);
//features.Resizing().ColumnSettings(cs =>
//{
// cs.ColumnSetting().ColumnKey("Designation").AllowResizing(false);
//});
//features.CellMerging();
features.MultiColumnHeaders();
})
.DataSourceUrl(Url.Action("IndexList", Model)) // cette action renvoie une serialization JSon d'un pagedDataListDto
.DataBind()
.Render()
)

$(function () {
$(document).contextmenu({

$(document).contextmenu({
// Delegate the context menu only to selected cells/rows
delegate: ".ui-iggrid-selectedcell.ui-state-active",
preventSelect: false,
menu: [
{ title: "Get Data", cmd: "getdata", uiIcon: "ui-icon-scissors" },
{ title: "Active Row", cmd: "active", uiIcon: "ui-icon-copy" }
],
select: function (event, ui) {
var $target = ui.target;
switch (ui.cmd) {
case "getdata":
var thanh1 = $('#gridPlanningProd').igGridSelection('selectedRow');
var thanh = $('#gridPlanningProd').igGridSelection('selectedCell');
break
case "active":
//var rowId = $("#gridPlanningProd").igGridSelection("activeRow").id;
//alert("The active row is #" + rowId);
break
}
}
});

</script>