[Ajax] jQuery Context Menu Pluging

11 octobre 2008 à 23:28:58

Bonjour, je viens de découvrir jQuery Context Menu Pluging qui est donc un pluging de la librairie jQuery. ( http://www.trendskitchens.co.nz/jquery/contextmenu/ )
Cependant, j'arrive pas à utiliser ce pluging qui est censé m'afficher un menu contextuel sur ma page.

Voici mon script:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>jquery script</title>
<script type="text/javascript" src="../js/jquery/jquery.contextmenu.r2.js"></script>
<script type="text/javascript" src="../js/jquery/jquery.js"></script>
<script type="text/javascript">
$('span.demo1').contextMenu('#listitems', {
      bindings: {
        'open': function(t) {
          alert('Trigger was '+t.id+'\nAction was Open');
        },
        'email': function(t) {
          alert('Trigger was '+t.id+'\nAction was Email');
        },
        'save': function(t) {
          alert('Trigger was '+t.id+'\nAction was Save');
        },
        'delete': function(t) {
          alert('Trigger was '+t.id+'\nAction was Delete');
        }
      }
    });
</script>
</head>
<body>

<div id="listitems" class="contextMenu" style="display:none;width:200px;background-color:white;border:1px solid black;padding:5px;">

      <ul>

        <li id="open"><img src="folder.png" /> Open</li>

        <li id="email"><img src="email.png" /> Email</li>

        <li id="save"><img src="disk.png" /> Save</li>

        <li id="close"><img src="cross.png" /> Close</li>

      </ul>

</div>

<span class="demo1" id="demo1_yellow" style="display:block; background-color:#FF0000"><b>RIGHT CLICK FOR DEMO</b></span>
</body>
</html>

Malheureusement, lorsque je clic sur mon span 'demo1', le menu contextuel ne s'affiche pas

QUelqu'un aurait-il une idée du problème?

Anonyme

12 octobre 2008 à 11:15:23

peut-être qu'en chargeant d'abord le script jquery.js ca fonctionnera mieu :

<script type="text/javascript" src="../js/jquery/jquery.js"></script>
<script type="text/javascript" src="../js/jquery/jquery.contextmenu.r2.js"></script>

titipotter

12 octobre 2008 à 11:51:39

J'ai éssayé mais sa change rien.
J'ai bien ma div listitems qui est invisible mais le menu ne s'applique pas à mon span.

Anonyme

12 octobre 2008 à 12:04:45

regarde la "console d'erreurs" (dans firefox : outils : console d'erreurs)

tu fais effacer puis tu recharge la page, les messages vont certainement t'aider.. mais je pense que tu dois de toute facon mettre jquery avant contextmenu (js)

je connais aps vraimetn jquery (j'utilise protype/scriptaculous) mais essaye aussi sans le 'span' dans cette ligne :
$('span.demo1')... -> $('demo1')...

titipotter

12 octobre 2008 à 12:23:49

J'ai éssayé également mais dans les 2 cas, la console d'érreur me renvoi aucune érreur malheureusement. :s

Anonyme

12 octobre 2008 à 12:28:06

$('span.demo1').contextMenu('listitems', {

faut pas le # (mais bien jquery.js avant contextmenu.js)

titipotter

12 octobre 2008 à 12:49:46

# supprimé et jquery bien avant le contextmenu mais toujours rien.
C'est bien bizarre tout sa.