2010-02-12 63 views
0

我想顯示在gridview中的每一行的上下文菜單。asp.net gridview jquery contextmenu

上下文菜單需要傳遞每行的特定變量,例如,唯一的用戶標識。

我想了ul只在頁面上一次我已經過了變量或東西

<ul id="myMenu" class="contextMenu"> 

<script src="scripts/jquery-1.3.2.js" type="text/javascript"></script>    
<script src="scripts/jquery.contextMenu.js" type="text/javascript"></script> 
    <link href="jquery.contextMenu.css" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript"> 

     $(document).ready(function() { 

      // Show menu when #myDiv is clicked 
      $("img").contextMenu({ 
        menu: 'myMenu' 
      }, 
        function(action, el, pos) { 
        alert(
         'Action: ' + action + '\n\n' + 
         'Element ID: ' + $(el).attr('id') + '\n\n' + 
         'X: ' + pos.x + ' Y: ' + pos.y + ' (relative to element)\n\n' + 
         'X: ' + pos.docX + ' Y: ' + pos.docY+ ' (relative to document)' 
         ); 
      });    


     }); 
</script> 


<form id="form1" runat="server"> 
<div> 
       <asp:GridView ID="Gridview1" runat="server" AutoGenerateColumns="false"> 
        <Columns> 
         <asp:TemplateField> 
          <ItemTemplate> 
           <asp:Image ID="imgPop" runat="server" ImageUrl="~/images/pop.gif" /> 
          </ItemTemplate> 
         </asp:TemplateField> 
         <asp:BoundField HeaderText="First Name" DataField ="FirstName" /> 
         <asp:BoundField HeaderText="Last Name" DataField ="LastName" /> 
        </Columns> 
       </asp:GridView>          
     <ul id="myMenu" class="contextMenu"> 
       <li class="edit"><a href="#edit">Edit</a></li> 
       <li class="cut separator"><a href="#cut">Cut</a></li> 
       <li class="copy"><a href="#copy">Copy</a></li> 
       <li class="paste"><a href="#paste">Paste</a></li> 
       <li class="delete"><a href="#delete">Delete</a></li> 
       <li class="quit separator"><a href="#quit">Quit</a></li> 
     </ul>  
</div> 

回答

0

更多的使用會從頁面輸出的實際HTML,如反對ASPX,因爲它似乎你的問題主要在於jQuery。

我還不能完全肯定,當你的上下文菜單中創建的,但是這將是你如何動態地添加它的DOM:

$("<ul id='myMenu' class='contextMenu'>").appendTo(selector); 
//...selector selects some item in the DOM. 

我沒有看到#MyDiv在HTML的任何地方,所以也許您需要:

<div id='MyDiv'> 

綁定到單擊事件:

$('#MyDiv').click(function(){ 
    //do something 
}); 

你能也許嘗試和有點CLE在你想要的東西上 - 甚至爲你的腳本樣本添加一些僞代碼,這樣我們就可以填補空白,例如,你設想使用userid的地方。