ナビゲーション リンクのスキップ
 新機能 の展開 新機能
 InputMan連携 の展開 InputMan連携
 マルチタッチ機能 の展開 マルチタッチ機能
 セル、行、列、ヘッダ の展開 セル、行、列、ヘッダ
 シート の縮小 シート
 スタイル の展開 スタイル
 選択 の展開 選択
 セル型 の展開 セル型
 編集 の展開 編集
 ソート の展開 ソート
 フィルタリング の展開 フィルタリング
 グループ化 の展開 グループ化
 ページング の展開 ページング
 スクロール の展開 スクロール
 データ連結 の展開 データ連結
 階層表示 の展開 階層表示
 コマンドバー の展開 コマンドバー
 チャート の展開 チャート
 数式 の展開 数式
 インポート/エクスポート の展開 インポート/エクスポート
 クライアント側スクリプト の展開 クライアント側スクリプト

コンテキストメニュー

SPREAD for ASP.NETでは、独自のコンテキストメニューを表示することができます。 コンテキストメニューは列ヘッダ、行ヘッダ、データ領域でそれぞれ設定することができます。

メニューはサーバー側のコード、マークアップコード、SPREADデザイナで作成することができ、 クリックされた際のイベントは、サーバー側とクライアント側で取得することができます。
 ID氏名カナ生年月日性別血液型部署入社日メールアドレス
11001亀甲 滋万キコウ シゲマ1950/02/04A人事部1972/04/01sigema_kikou@abc.co.jp
21002寒田 希世カンダ キヨ1959/06/28B人事部1981/04/01kiyo_kanda@bbb.or.jp
31003小和瀬 澄オワセ キヨ1969/03/06A人事部1991/04/01kiyo_owase@aaa.co.jp
41004宇夫 早余子ウブ サヨコ1976/07/28O人事部1998/04/01sayoko_ubu@bbb.or.jp
51005宇田津 聖智ウダツ キヨトモ1965/09/04A営業部1987/04/01kiyotomo_udatu@abc.co.jp
61006茨城 昭児イバラキ ショウジ1963/04/28O営業部1985/04/01shouzi_ibaraki@xyz.ne.jp
71007石ヶ休 椎茄イシガキュウ シイナ1953/02/21O営業部1975/04/01siina_isigagyuu@abc.co.jp
81008赤司 恵治郎アカツカサ ケイジロウ1968/08/02O経理部1990/04/01keizirou_akatukasa@abc.co.jp
91009小橋 仰一オハシ ギョウイチ1972/03/02B経理部1994/04/01gyouiti_ohasi@abc.co.jp
101010一重 公大イチジュウ コウダイ1964/04/19B経理部1986/04/01koudai_itizyuu@xyz.ne.jp
111011稲並 勝五郎イナミ ショウゴロウ1962/02/18A営業部1984/04/01shougorou_inami@bbb.or.jp
121012穎原 紀代一エイハラ キヨカズ1965/02/13O営業部1987/04/01kiyokazu_eihara@bbb.or.jp
131013安士 定助アンシ サダスケ1964/09/09AB経理部1986/04/01sadasuke_ansi@aaa.co.jp
141014今重 邦三郎イマジュウ クニサブロウ1969/09/01O営業部1991/04/01kunisaburou_imazyuu@xyz.ne.jp
151015魚見 秀里ウオミ シュウリ1974/04/23A営業部1996/04/01shuuri_uomi@abc.co.jp
161016小佐井 幸仁オサイ コウジ1966/10/23A営業部1988/04/01kouzi_osai@aaa.co.jp
171017大高 吉左右オオダカ キチサユウ1950/10/07B営業部1972/04/01kitisayuu_oodaka@bbb.or.jp
181018上垣内 正名カミガイト ショウメイ1978/06/19O営業部2000/04/01shoumei_kamigaito@abc.co.jp
191019金曽 憙佳カネソ キヨシ1965/01/03AB営業部1987/04/01kiyosi_kaneso@xyz.ne.jp
201020吉光 定太郎キッコウ サダタロウ1960/10/18AB営業部1982/04/01sadatarou_kikkou@abc.co.jp
211021小曾 三三コソ サンゾウ1966/06/17O営業部1988/04/01sanzou_koso@xyz.ne.jp
221022貴俵 健有キヒョウ ケンユウ1952/02/26A営業部1974/04/01kenyuu_kihyou@abc.co.jp
231023蔭島 太郎カゲシマ タロウ1952/10/09A営業部1974/04/01tarou_kagesima@abc.co.jp
241024金賀 憲逸カナガ ケンイツ1954/01/01B営業部1976/04/01kenitu_kanaga@xyz.ne.jp
251025楠下 サヤ子クスノキシタ サヤコ1953/03/27O営業部1975/04/01sayako_kusunokisita@bbb.or.jp
261026角本 好七カドモト コウシチ1954/10/02O営業部1976/04/01kousiti_kadomoto@abc.co.jp
271027蒲沢 宗英ガマザワ シュウエイ1967/03/23O営業部1989/04/01shuuei_gamazawa@abc.co.jp
281028久角 堅市クスミ ケンイチ1969/09/04A営業部1991/04/01keniti_kusumi@bbb.or.jp
291029郷田 圭亮サトダ ケイスケ1961/05/16A製品部1983/04/01keisuke_satoda@abc.co.jp
301030倉員 恵孝ソウイン ケイタカ1959/09/05A製品部1981/04/01keitaka_souin@bbb.or.jp
311031饒村 九三子ジョウムラ クミコ1950/08/20A人事部1972/04/01kumiko_zyaumura@zzz.ne.jp
321032潮屋 恵勇シオヤ ケイユウ1977/02/26B人事部1999/04/01keiyuu_sioya@abc.co.jp
331033多留 光八タル コウハチ1961/06/01O営業部1983/04/01kouhati_taru@bbb.or.jp
341034茶本 将司サモト ショウジ1951/01/24AB営業部1973/04/01shouzi_samoto@zzz.ne.jp
351035大部 悟作ダイベ ゴサク1965/08/19O営業部1987/04/01gosaku_daibe@abc.co.jp
361036立井 健七タテイ ケンシチ1969/02/25O経理部1991/04/01kensiti_tatei@bbb.or.jp
371037高橋 賢一朗タカハシ ケンイチロウ1974/04/02O経理部1996/04/01kenitirou_takahasi@xyz.ne.jp
381038請川 公平セイカワ クンペイ1957/05/16B営業部1979/04/01kunpei_seikawa@abc.co.jp
391039椹木 公己サワキ コウキ1969/05/14A営業部1991/04/01kouki_sawaki@bbb.or.jp
401040田底 清策タゾコ キヨカズ1967/02/10A営業部1989/04/01kiyokazu_tazoko@bbb.or.jp
411041調 佐之助シラベ サノスケ1964/06/06A製品部1986/04/01sanosuke_sirabe@abc.co.jp
421042垰野 久仁弘タオノ クニヒロ1966/08/23B製品部1988/04/01kunihiro_taono@xyz.ne.jp
431043麝島 冴ジャジマ サエ1966/02/16B営業部1988/04/01sae_zyazima@abc.co.jp
441044砂古口 祥公サコグチ サチキミ1969/03/27O製品部1991/04/01satikimi_sakoguti@abc.co.jp
451045桜谷 欣重サクラタニ キンジュウ1960/07/22O製品部1982/04/01kinzyuu_sakuratani@zzz.ne.jp
461046赤野 茂貞セキノ シゲサダ1958/09/05B営業部1980/04/01sigesada_sekino@xyz.ne.jp
471047栄永 貢右サカエナガ コウユウ1951/02/06B製品部1973/04/01kouyuu_sakaenaga@aaa.co.jp
481048鷹木 サツタカキ サツ1957/10/05B製品部1979/04/01satu_takaki@abc.co.jp
491049澤海 剛義サワウミ ゴウヨシ1960/02/09O製品部1982/04/01gouyosi_sawaumi@abc.co.jp
501050外江 昊司ソトエ コウジ1968/07/23製品部1990/04/01gouyosi_sawaumi@abc.co.jp
   

ソースコード

別ウィンドウで表示
using System;
using System.Web.UI.WebControls;

public partial class sheet_contextmenu : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

        // クライアントイベント設定
        string js = "var spid='" + FpSpread1.ClientID + "';";
        js += "var ss=document.getElementById(spid);" + "\r\n";
        js += "if (ss.addEventListener) {" + "\r\n";
        js += "    ss.addEventListener(\"MenuItemClicked\", spread_MenuItemClicked, false);" + "\r\n";
        js += "} else {" + "\r\n";
        js += "    ss.onMenuItemClicked = spread_MenuItemClicked;" + "\r\n";
        js += "}" + "\r\n";

        ClientScript.RegisterStartupScript(this.GetType(), "onStartUpScript", js, true);

        if (IsPostBack)
        {
            return;
        }

        // SPREADの設定
        InitSpread(FpSpread1);

        // シート設定
        InitSpreadStyles(FpSpread1.Sheets[0]);
    }

    private void InitSpread(FarPoint.Web.Spread.FpSpread spread)
    {
        //データ連結
        System.Data.DataSet ds = new System.Data.DataSet();
        ds.ReadXml(MapPath("../App_Data/data50.xml"));
        spread.DataSource = ds;

        FarPoint.Web.Spread.ContextMenu vpMenu = new FarPoint.Web.Spread.ContextMenu();
        vpMenu.Type = FarPoint.Web.Spread.ContextMenuType.Viewport;

        // コピー
        FarPoint.Web.Spread.MenuItem copyVpItem = new FarPoint.Web.Spread.MenuItem("コピー");
        copyVpItem.ImageUrl = "../images/contextmenu/Copy.png";

        // 貼り付け
        FarPoint.Web.Spread.MenuItem pasteVpItem = new FarPoint.Web.Spread.MenuItem("貼り付け");
        pasteVpItem.ImageUrl = "../images/contextmenu/Paste.png";

        FarPoint.Web.Spread.MenuItem editVpItem = new FarPoint.Web.Spread.MenuItem("セル操作");
        editVpItem.ChildItems.AddRange(new FarPoint.Web.Spread.MenuItem[] {
            copyVpItem, 
            pasteVpItem 
        });
        vpMenu.Items.Add(editVpItem);

        spread.EnableContextMenu = true;
        spread.ContextMenus.Add(vpMenu);

        spread.CssClass = "spreadStyle";
        spread.UseClipboard = false;
    }

    private void InitSpreadStyles(FarPoint.Web.Spread.SheetView sheet)
    {
        // フォントサイズの設定
        sheet.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.ColumnHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.RowHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.SheetCorner.DefaultStyle.Font.Size = FontUnit.Parse("80%");

        // 列幅の設定
        sheet.Columns[0].Width = 36;
        sheet.Columns[1].Width = 88;
        sheet.Columns[2].Width = 91;
        sheet.Columns[3].Width = 80;
        sheet.Columns[4].Width = 36;
        sheet.Columns[5].Width = 46;
        sheet.Columns[6].Width = 49;
        sheet.Columns[7].Width = 80;
        sheet.Columns[8].Width = 181;

        // 縦方向の揃え位置を中央に設定
        sheet.DefaultStyle.VerticalAlign = VerticalAlign.Middle;

        // ページサイズの設定
        sheet.PageSize = 50;
    }
}

Partial Class sheet_contextmenu
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        ' クライアントイベント設定
        Dim js As String = "var spid='" + FpSpread1.ClientID & "';"
        js += "var ss=document.getElementById(spid);" & vbCr & vbLf
        js += "if (ss.addEventListener) {" & vbCr & vbLf
        js += "    ss.addEventListener(""MenuItemClicked"", spread_MenuItemClicked, false);" & vbCr & vbLf
        js += "} else {" & vbCr & vbLf
        js += "    ss.onMenuItemClicked = spread_MenuItemClicked;" & vbCr & vbLf
        js += "}" & vbCr & vbLf

        ClientScript.RegisterStartupScript(Me.[GetType](), "onStartUpScript", js, True)

        If IsPostBack Then
            Return
        End If

        ' SPREADの設定
        InitSpread(FpSpread1)

        ' シート設定
        InitSpreadStyles(FpSpread1.Sheets(0))
    End Sub

    Private Sub InitSpread(ByVal spread As FarPoint.Web.Spread.FpSpread)
        'データ連結
        Dim ds As New System.Data.DataSet()
        ds.ReadXml(MapPath("../App_Data/data50.xml"))
        spread.DataSource = ds

        Dim vpMenu As New FarPoint.Web.Spread.ContextMenu()
        vpMenu.Type = FarPoint.Web.Spread.ContextMenuType.Viewport

        ' コピー
        Dim copyVpItem As New FarPoint.Web.Spread.MenuItem("コピー")
        copyVpItem.ImageUrl = "../images/contextmenu/Copy.png"

        ' 貼り付け
        Dim pasteVpItem As New FarPoint.Web.Spread.MenuItem("貼り付け")
        pasteVpItem.ImageUrl = "../images/contextmenu/Paste.png"

        Dim editVpItem As New FarPoint.Web.Spread.MenuItem("セル操作")
        editVpItem.ChildItems.AddRange(New FarPoint.Web.Spread.MenuItem() {copyVpItem, pasteVpItem})
        vpMenu.Items.Add(editVpItem)

        spread.EnableContextMenu = True
        spread.ContextMenus.Add(vpMenu)

        spread.CssClass = "spreadStyle"
        spread.UseClipboard = False
    End Sub

    Private Sub InitSpreadStyles(ByVal sheet As FarPoint.Web.Spread.SheetView)
        ' フォントサイズの設定
        sheet.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.ColumnHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.RowHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.SheetCorner.DefaultStyle.Font.Size = FontUnit.Parse("80%")

        ' 列幅の設定
        sheet.Columns(0).Width = 36
        sheet.Columns(1).Width = 88
        sheet.Columns(2).Width = 91
        sheet.Columns(3).Width = 80
        sheet.Columns(4).Width = 36
        sheet.Columns(5).Width = 46
        sheet.Columns(6).Width = 49
        sheet.Columns(7).Width = 80
        sheet.Columns(8).Width = 181

        ' 縦方向の揃え位置を中央に設定
        sheet.DefaultStyle.VerticalAlign = VerticalAlign.Middle

        ' ページサイズの設定
        sheet.PageSize = 50
    End Sub
End Class
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
  CodeFile="contextmenu.aspx.cs" Inherits="sheet_contextmenu" %>

<%@ Register Assembly="FarPoint.Web.SpreadJ" Namespace="FarPoint.Web.Spread" TagPrefix="FarPoint" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeaderPlaceHolder1" runat="Server">
<script type="text/javascript">
    function spread_MenuItemClicked(e) {
        var e = e || window.event;
        var spread = document.getElementById(spid);
        var menuItem = e.SelectedItem;

        var node = menuItem.childNodes[1].childNodes[0];
        var itemText;
        if (node.nodeType == 1) {
            itemText = node.innerText;
        } else {
            itemText = node.data;
        }
        switch (itemText) {
            // セル操作
            case "コピー":
                spread.Copy();
                break;
            case "貼り付け":
                spread.Paste();
                break;
            // 列操作
            case "列幅を列内の最長テキストに調整":
                var rg = spread.GetSelectedRange();
                for (var i = rg.col; i < rg.col + rg.colCount; i++) {
                    spread.SizeToFit(i);
                }
                break;
            case "列幅の調整...":
                var newWidth = prompt("この列の列幅を入力してください", spread.Columns(spread.GetActiveCol()).GetWidth());                
                if (!isNaN(newWidth) && newWidth != null) {
                    var rg = spread.GetSelectedRange();
                    for (var i = rg.col; i < rg.col + rg.colCount; i++) {
                        spread.SetColWidth(i, newWidth);
                    }
                }
                break;
            // 行操作
            case "行の削除":
                spread.Delete();
                break;
            case "この行を先頭にスクロール":
                spread.ScrollTo(spread.ActiveRow, 1);
                break;
            default:
                return;
        }
        e.cancel = true;
    }
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <FarPoint:FpSpread ID="FpSpread1" runat="server" BorderColor="#A0A0A0" BorderStyle="Solid"
        BorderWidth="1px">
        <CommandBar BackColor="#F6F6F6" ButtonFaceColor="Control" ButtonHighlightColor="ControlLightLight"
            ButtonShadowColor="ControlDark">
        </CommandBar>
        <Sheets>
            <FarPoint:SheetView SheetName="Sheet1">
            </FarPoint:SheetView>
        </Sheets>
        <ContextMenus>
            <FarPoint:ContextMenu Type="ColumnHeader">
            <Items>
                <FarPoint:MenuItem Text="列操作">
                <ChildItems>
                    <FarPoint:MenuItem Text="列幅を列内の最長テキストに調整">
                    </FarPoint:MenuItem>
                    <FarPoint:MenuItem Text="列幅の調整...">
                    </FarPoint:MenuItem>
                </ChildItems>
                </FarPoint:MenuItem>
            </Items>
            </FarPoint:ContextMenu>
            <FarPoint:ContextMenu Type="RowHeader">
            <Items>
                <FarPoint:MenuItem Text="行操作">
                <ChildItems>
                    <FarPoint:MenuItem Text="行の削除">
                    </FarPoint:MenuItem>
                    <FarPoint:MenuItem Text="この行を先頭にスクロール">
                    </FarPoint:MenuItem>
                </ChildItems>
                </FarPoint:MenuItem>
            </Items>
            </FarPoint:ContextMenu>
        </ContextMenus>
    </FarPoint:FpSpread>
</asp:Content>