asp.net 如何给GridView添加右键菜单。。。

Question

如题。做过的，路过的都来说说。我的GridView里边只有一个字段，就是存储一个用户名。我想给GridView的每一行添加右键菜单。

Answer 1

利用js，在RowDataBound事件里给每行添加一个鼠标右键事件处理，注意要屏蔽浏览器本身的右键菜单，自己的右键菜单用层来显示

Answer 2

function contextMenu()
{
 this.items   = new Array();
 
 this.addItem = function (item)
 {
  this.items[this.items.length] = item;
 } this.show = function (oDoc)
 {
  var strShow = "";
  var i;
  
  strShow = "<div id=\"rightmenu\" style=\"BACKGROUND-COLOR: #ffffff; BORDER: #000000 1px solid; LEFT: 0px; POSITION: absolute; TOP: 0px; VISIBILITY: hidden; Z-INDEX: 10\">";
  strShow += "<table border=\"0\" height=\"";
  strShow += this.items.length * 20;
  strShow += "\" cellpadding=\"0\" cellspacing=\"0\">";
  strShow += "<tr height=\"3\"><td bgcolor=\"#d0d0ce\" width=\"2\"></td><td>";
  strShow += "<table border=\"0\" width=\"100%\" height=\"100%\" cellpadding=0 cellspacing=0 bgcolor=\"#ffffff\">";
  strShow += "<tr><td bgcolor=\"#d0d0ce\" width=\"23\"></td><td><img src=\" \" height=\"1\" border=\"0\"></td></tr></table>";
  strShow += "</td><td width=\"2\"></td></tr>";
  strShow += "<tr><td bgcolor=\"#d0d0ce\"></td><td>";
  strShow += "<table border=\"0\" width=\"100%\" height=\"100%\" cellpadding=3 cellspacing=0 bgcolor=\"#ffffff\">";
  oDoc.write(strShow);
  for(i=0; i<this.items.length; i++)
  {
   this.items[i].show(oDoc);
  }
  strShow = "</table></td><td></td></tr>";
  strShow += "<tr height=\"3\"><td bgcolor=\"#d0d0ce\"></td><td>";
  strShow += "<table border=\"0\" width=\"100%\" height=\"100%\" cellpadding=0 cellspacing=0 bgcolor=\"#ffffff\">";
  strShow += "<tr><td bgcolor=\"#d0d0ce\" width=\"23\"></td><td><img src=\" \" height=\"1\" border=\"0\"></td></tr></table>";
  strShow += "</td><td></td></tr>";
  strShow += "</table></div>\n";
  oDoc.write(strShow);
 }
}// menu Item object
function contextItem(text, icon, cmd, type)
{
 this.text = text ? text : "";
 this.icon = icon ? icon : "";
 this.cmd = cmd ? cmd : "";
 this.type = type ? type : "menu";
 
 this.show = function (oDoc)
 {
  var strShow = "";
  
  if(this.type == "menu")
  {
   strShow += "<tr ";
   strShow += "onmouseover=\"changeStyle(this, 'on');\" ";
   strShow += "onmouseout=\"changeStyle(this, 'out');\" ";
   strShow += "onclick=\"";
   strShow += this.cmd;
   strShow += "\">";
   strShow += "<td class=\"ltdexit\" width=\"16\">";
   if (this.icon == "")
    strShow += "&nbsp;";
   else {
    strShow += "<img border=\"0\" src=\"";
    strShow += this.icon;
    strShow += "\" width=\"16\" height=\"16\" style=\"POSITION: relative\"></img>";
   }
   strShow += "</td><td class=\"mtdexit\">";
   strShow += this.text;
   strShow += "</td><td class=\"rtdexit\" width=\"5\">&nbsp;</td></tr>";
  }
  else if (this.type == "separator")
  {
   strShow += "<tr><td class=\"ltdexit\">&nbsp;</td>";
   strShow += "<td class=\"mtdexit\" colspan=\"2\"><hr color=\"#000000\" size=\"1\"></td></tr>";
  }
  
  oDoc.write(strShow);
 }
}function changeStyle(obj, cmd)
{ 
 if(obj) try {
  var imgObj = obj.children(0).children(0);
  
  if(cmd == 'on') {
   obj.children(0).className = "ltdfocus";
   obj.children(1).className = "mtdfocus";
   obj.children(2).className = "rtdfocus";
   if(imgObj)
   {
    if(imgObj.tagName.toUpperCase() == "IMG")
    {
     imgObj.style.left = "-1px";
     imgObj.style.top = "-1px";
    }
   }
  }
  else if(cmd == 'out') {
   obj.children(0).className = "ltdexit";
   obj.children(1).className = "mtdexit";
   obj.children(2).className = "rtdexit";
   if(imgObj)
   {
    if(imgObj.tagName.toUpperCase() == "IMG")
    {
     imgObj.style.left = "0px";
     imgObj.style.top = "0px";
    }
   }
  }
 }
 catch (e) {}
}function showMenu()
{
 var x, y, w, h, ox, oy;
 
 x = event.clientX;
 y = event.clientY;
 
 var obj = document.getElementById("rightmenu");
 if (obj == null)
  return true;
 
 ox = document.body.clientWidth;
 oy = document.body.clientHeight;
 if(x > ox || y > oy)
  return false;
 w = obj.offsetWidth;
 h = obj.offsetHeight;
 if((x + w) > ox)
   x = x - w;
 if((y + h) > oy)
  y = y - h;
 
 obj.style.posLeft = x + document.body.scrollLeft;
 obj.style.posTop = y + document.body.scrollTop;
 obj.style.visibility = "visible";
 
 return false;
}
function hideMenu()
{
 if(event.button == 0)
 {
  var obj = document.getElementById("rightmenu");
  if (obj == null)
   return true;
  obj.style.visibility = "hidden";
  obj.style.posLeft = 0;
  obj.style.posTop = 0;
 }
}function writeStyle()
{
 var strStyle = "";
 
 strStyle += "<STYLE type=text/css>";
 strStyle += "TABLE {Font-FAMILY: \"Tahoma\",\"Verdana\",\"宋体\"; FONT-SIZE: 9pt}";
 strStyle += ".mtdfocus {BACKGROUND-COLOR: #ccccff; BORDER-BOTTOM: #000000 1px solid; BORDER-TOP: #000000 1px solid; CURSOR: hand}";
 strStyle += ".mtdexit {BACKGROUND-COLOR: #ffffff; BORDER-BOTTOM: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid}";
 strStyle += ".ltdfocus {BACKGROUND-COLOR: #ccccff; BORDER-BOTTOM: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; CURSOR: hand}";
 strStyle += ".ltdexit {BACKGROUND-COLOR: #d0d0ce; BORDER-BOTTOM: #d0d0ce 1px solid; BORDER-TOP: #d0d0ce 1px solid; BORDER-LEFT: #d0d0ce 1px solid}";
 strStyle += ".rtdfocus {BACKGROUND-COLOR: #ccccff; BORDER-BOTTOM: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; CURSOR: hand}";
 strStyle += ".rtdexit {BACKGROUND-COLOR: #ffffff; BORDER-BOTTOM: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid; BORDER-RIGHT: #ffffff 1px solid}";
 strStyle += "</STYLE>";
 
 document.write(strStyle);
}function makeMenu()
{
 var myMenu, item;
 
 var homepage_cmd = "this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.qpsh.com/'); return false;";
 var favorate_cmd = "window.external.addFavorite('http://www.qpsh.com/','网页特效'); return false;";
 var viewcode_cmd = "window.location = 'view-source:'+'http://www.qpsh.com/";
 
 myMenu = new contextMenu();
 
 item = new contextItem("返回主页", "http://localhost/r2.8/Themes/Default/images/bt_2/btn_add.gif", "top.location='http://www.qpsh.com/';", "menu");
 myMenu.addItem(item);
 
 item = new contextItem("设为主页", "http://localhost/r2.8/Themes/Default/images/bt_2/btn_add.gif", homepage_cmd, "menu");
 myMenu.addItem(item);
 
 item = new contextItem("添加到收藏夹", "http://localhost/r2.8/Themes/Default/images/bt_2/btn_add.gif", favorate_cmd, "menu");
 myMenu.addItem(item);
 
 item = new contextItem("联系作者", "http://localhost/r2.8/Themes/Default/images/bt_2/btn_add.gif", "location.href='http://www.qpsh.com'", "menu");
 myMenu.addItem(item);
 
 item = new contextItem("", "", "", "separator");
 myMenu.addItem(item);
 
 item = new contextItem("察看源码", "http://localhost/r2.8/Themes/Default/images/bt_2/btn_add.gif", "location.href='http://www.qpsh.com/javascript/showpage2277.htm'", "menu");
 myMenu.addItem(item);
 
 myMenu.show(this.document); delete item;
 delete myMenu;
}function toggleMenu(isEnable)
{
 if(isEnable)
  document.oncontextmenu = showMenu;
 else
  document.oncontextmenu = new function() {return true;};
}
       writeStyle();
makeMenu();
document.onclick = hideMenu;
document.oncontextmenu = showMenu;  
将对应table的ID命名为id="docBoard"就可以了  但是这里没有选中行效果只是右击菜单 

Answer 3

                        <asp:UpdatePanel ID="ChatListPanel" runat="server" UpdateMode=Conditional>
                            <ContentTemplate>
                                <asp:GridView ID="OnlineUserGridView" runat="server"  AutoGenerateColumns="False" 
                                    OnRowDataBound="GVSelect_RowDataBound">
                                    <Columns>
                                        <asp:BoundField DataField="UserName" HeaderText="在线用户" >
                                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                        </asp:BoundField>
                                    </Columns>
                                </asp:GridView>
                                登陆时间:<asp:Label ID="Label2" runat="server" Text="系统时间"></asp:Label>
                            </ContentTemplate>
                        </asp:UpdatePanel>
这是我的GridView只有一个字段“UserName”，我就像跟它添加右键菜单。能否楼上的几位同胞说的详细点。

Answer 4

这个就是你想要的：http://www.cnblogs.com/webabcd/archive/2007/02/01/637485.html

Answer 5

4楼的能否解释的详细带你？我的是GridView你说Table干嘛？我把我的GridView的ID换了也没用啊，能否解释下你的代码？

Answer 6

再顶下，GridView里边最困难的一个功能我觉得就是这个右键菜单了，其它的功能都是相对简单的。请大家踊跃想办法啊。

Answer 7

<script language='javascript'> 
        var mname=new Array( 
        "进行私聊", 
        "踢出该用户", 
        "刷 新" 
        ); 
        //mname是菜单对应的名称，数组的个数必须与下面murl对应 
        var murl=new Array( 
        "chatAlone();", 
        "kickOut();", 
        "alert('刷新');" 
        ); 
        //murl是菜单对应的操作，可以是任意javascript代码但是要注意不要在里面输入\"，只能用' 
        //如果要实现跳转可以这样window.location='url'; 
        var ph=18,mwidth=50;//每条选项的高度,菜单的总宽度 
        var bgc="White",txc="black";//菜单没有选中的背景色和文字色 
        var cbgc="#8EC26F",ctxc="white";//菜单选中的选项背景色和文字色 
        /****************以下代码请不要修改******************/ 
        var mover="this.style.background='"+cbgc+"';this.style.color='"+ctxc+"';" 
        var mout="this.style.background='"+bgc+"';this.style.color='"+txc+"';" 
        document.oncontextmenu=function() 
        { 
        mlay.style.display=""; 
        mlay.style.pixelTop=event.clientY; 
        mlay.style.pixelLeft=event.clientX; 
        return false; 
        } 
        //关闭菜单
        function showoff() 
        { 
        mlay.style.display="none"; 
        } 
        //载入菜单
        function fresh() 
        {
            mlay.style.background=bgc; 
            mlay.style.color=txc; 
            mlay.style.width=mwidth; 
            mlay.style.height=mname.length*ph; 
            var h="<table width=150px height="+mname.length*ph+"px cellpadding=0 cellspacing=0 border=1>"; 
            var i=0; 
            for(i=0;i<mname.length;i++) 
            { 
            h+="<tr align=center height="+ph+" onclick=\""+murl[i]+"\" onMouseover=\""+mover+"\" onMouseout=\""+mout+"\"><td style='font-size:9pt;'>"+mname[i]+"</td></tr>"; 
            } 
            h+="</table>"; 
            mlay.innerHTML=h; 
          
        }
        //进行私聊
        function chatAlone()
        {
        alert('进行私聊');
        var value=document.all.OnlineUserGridView.rows(0).cell(0).Text;
        alert(value);
        }
        //踢出用户
        function kickOut() 
        {
            alert('踢出用户');
        }
        
        function display() 
        {
            if (event.button == 2) 
            {
               fresh();
            }
            
        }
    </script> 
<body   onClick="showoff();" onload="fresh();">这样可以弹出一个比较简单的右键菜单。