пятница, 21 октября 2011 г.

Popup menu for Gridview

Скрипт контекстного меню (context menu), которое появляется при правом клике мыши на строке Gridview, пункты меню появляются в зависимости от значения конкретного столбца в строке, в данном случае столбца Status.
Используется DevExpress v.10.2.4.0

Страница Default.aspx
<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="DevExpress.Web.v10.2, Version=10.2.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxMenu" TagPrefix="dx" %>

<%@ Register Assembly="DevExpress.Web.ASPxGridView.v10.2, Version=10.2.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxGridView" TagPrefix="dx" %>

<%@ Register assembly="DevExpress.Web.ASPxEditors.v10.2, Version=10.2.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxEditors" tagprefix="dx" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
    <script type="text/javascript">

        function OnGetRowValues(values) {
            var Status = values[1];

            //Check status
            if (Status == "Sucsess") {
                ASPxPopupMenu1.GetItem(0).SetEnabled(true);
                ASPxPopupMenu1.GetItem(1).SetEnabled(false);
            } else if (Status == "Fault") {
                ASPxPopupMenu1.GetItem(0).SetEnabled(false);
                ASPxPopupMenu1.GetItem(1).SetEnabled(true);
            }
        }

        function grid_ContextMenu(s, e) {
            if (e.objectType == "row") {
                ASPxGridView1.GetRowValues(e.index, 'Data;Status', OnGetRowValues);
                ASPxPopupMenu1.ShowAtPos(ASPxClientUtils.GetEventX(e.htmlEvent), ASPxClientUtils.GetEventY(e.htmlEvent));
            }

        }

</script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <dx:ASPxGridView ID="ASPxGridView1" runat="server" ClientInstanceName="ASPxGridView1">
        <ClientSideEvents ContextMenu="grid_ContextMenu" />
        <SettingsCustomizationWindow Enabled="True" />    
    </dx:ASPxGridView>
    <dx:ASPxPopupMenu ID="ASPxPopupMenu1" runat="server" ClientInstanceName="ASPxPopupMenu1">
        <Items>
            <dx:MenuItem Text="Menu 1" Name="menu1">
            </dx:MenuItem>
            <dx:MenuItem Text="Menu 2" Name="menu2">
            </dx:MenuItem>
        </Items>
        <ClientSideEvents
            ItemClick="function(s, e) {
                if(e.item.name == 'menu1') {
                    alert('Menu 1 action.')
                } else if(e.item.name == 'menu2') {
                    alert('Menu 2 action.')
                }
            }" />
    </dx:ASPxPopupMenu>
</asp:Content>


Страница Default.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Init(object sender, EventArgs e)
    {
        ASPxGridView1.DataSource = GetDataTable();
        ASPxGridView1.KeyFieldName = "ID";
    }
  
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    private DataTable GetDataTable()
    {
        DataTable table = new DataTable();
        table.Columns.Add("ID", typeof(Int32));
        table.Columns.Add("Data", typeof(String));
        table.Columns.Add("Status", typeof(String));
        table.Rows.Add(1, "Data row 1", "Sucsess");
        table.Rows.Add(2, "Data row 2", "Fault");
        table.Rows.Add(3, "Data row 3", "Sucsess");
        return table;
    }

}

Комментариев нет:

Отправить комментарий