Je convertis jqgrid (4.6.0) en free-jqgrid (4.14.1). Tout semble fonctionner, mais je n'obtiens pas mon menu contextuel lorsque je clique avec le bouton droit sur la grille (le bouton de recherche de la barre d'outils fonctionne toujours). Y at-il une importation supplémentaire ou quelque chose dont j'ai besoin? Voici ce que je suis en train de mettre en:Conversion de jqgrid en free-jqgrid, maintenant pas de menu contextuel
jqueryui/1.12.1/themes/smoothness/jquery-ui.css
free-jqgrid/4.14.1/css/ui.jqgrid.css
free-jqgrid/4.14.1/plugins/css/ui.multiselect.css
jquery/3.2.1/jquery.min.js
jqueryui/1.12.1/jquery-ui.min.js
free-jqgrid/4.14.1/plugins/min/ui.multiselect.js
free-jqgrid/4.14.1/i18n/grid.locale-en.js
free-jqgrid/4.14.1/jquery.jqgrid.min.js
free-jqgrid/4.14.1/plugins/jquery.contextmenu.js
TIA
Edit:
grid.contextMenu(menuId, {
bindings : myBinding,
onContextMenu : function(e) {
var p = grid[0].p,
i,
lastSelId,
$target = $(e.target),
rowId = $target.closest("tr.jqgrow").attr("id"),
isInput = $target.is(':text:enabled') || $target.is('input[type=textarea]:enabled') || $target.is('textarea:enabled');
if (rowId && !isInput && jqGridGetSelectedText() === '') {
i = $.inArray(rowId, p.selarrrow);
if (p.selrow !== rowId && i < 0) {
// prevent the row from be unselected
// the implementation is for "multiselect:false" which we use,
// but one can easy modify the code for "multiselect:true"
grid.jqGrid('setSelection', rowId);
} else if (p.multiselect) {
// Edit will edit FIRST selected row.
// rowId is allready selected, but can be not the last selected.
// Se we swap rowId with the first element of the array p.selarrrow
lastSelId = p.selarrrow[p.selarrrow.length - 1];
if (i !== p.selarrrow.length - 1) {
p.selarrrow[p.selarrrow.length - 1] = rowId;
p.selarrrow[i] = lastSelId;
p.selrow = rowId;
}
}
return true;
} else {
return false;
// no contex menu
}
},
menuStyle : {
backgroundColor : '#fcfdfd',
border : '1px solid #a6c9e2',
maxWidth : '600px',
width : '100%'
},
itemHoverStyle : {
border : '1px solid #79b7e7',
color : '#1d5987',
backgroundColor : '#d0e5f5'
}
});
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.14.1/css/ui.jqgrid.min.css" type="text/css" media="screen" />
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.14.1/plugins/css/ui.multiselect.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.14.1/plugins/min/ui.multiselect.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.14.1/i18n/grid.locale-en.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.14.1/jquery.jqgrid.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.14.1/plugins/jquery.createcontexmenufromnavigatorbuttons.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.14.1/plugins/jquery.contextmenu-ui.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/claro/claro.css" media="screen">
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<title>jqGrid Loading Data - Million Rows from a REST service</title>
</head>
<body>
<table id="jqGrid"></table>
<div id="jqGridPager"></div>
<script type="text/javascript">
$(document).ready(function() {
$("#jqGrid").jqGrid({
url : 'http://trirand.com/blog/phpjqgrid/examples/jsonp/getjsonp.php?callback=?&qwery=longorders',
mtype : "GET",
datatype : "jsonp",
colModel : [{
label : 'OrderID',
name : 'OrderID',
key : true,
width : 75
}, {
label : 'Customer ID',
name : 'CustomerID',
width : 150
}, {
label : 'Order Date',
name : 'OrderDate',
width : 150
}, {
label : 'Freight',
name : 'Freight',
width : 150
}, {
label : 'Ship Name',
name : 'ShipName',
width : 150
}],
viewrecords : true,
width : 780,
height : 250,
rowNum : 20,
pager : "#jqGridPager"
}).jqGrid('navGrid', "#jqGridPager", {
add : true,
edit : true,
view : true,
del : true,
search : true,
refresh : true
}).jqGrid("createContexMenuFromNavigatorButtons", $("#jqGrid").jqGrid("getGridParam", "pager"))
});
</script>
</body>
</html>
On peut créer le menu contextuel de différentes manières. Vous devez au moins publier le code JavaScript que vous utilisez. Il est difficile de vous aider si vous ne postez pas ** la démo **, ce qui reproduit le problème. Ayant JSFiddle démo, par exemple on pourrait non seulement reproduire le problème, mais réparer le code pour le faire fonctionner. Personnellement, je n'utilise que 'createContexMenuFromNavigatorButtons' depuis' plugins/jquery.createcontexmenufromnavigatorbuttons.js' avec 'plugins/jquery.contextmenu-ui'. – Oleg
J'ai (incorrectement) supposé que ce serait un problème de migration commun avec une solution facile. Désolé – user2340157
Pourriez-vous préparer ** la démo **, qui reproduit le problème? Utilisez-vous 'multiselect: true' ou pas, par exemple? Le code que vous avez posté ne contient pas la définition de 'jqGridGetSelectedText',' myBinding' et 'menuId' et le fragment HTML correspondant, qui définit le div du menu. Et ainsi de suite ... Vous pourriez utiliser une combinaison d'options, ce qui pourrait avoir des effets secondaires. Il se peut que l'utilisation de l'option 'singleSelectClickMode:" selectonly "' résout le problème. On ne peut pas se résoudre à deviner ce que cela pourrait être. Il faut être capable de reproduire le problème. Après que tout sera clair – Oleg