DevExpress社のASP.NETのリボン配下の任意のボタンから、サーバーにイベントを送る

DevExpress社のASP.NETには、リボン部品が提供されており、このリボン配下のボタンを
クリックした場合、クライアント及びサーバー側でイベント発火させることができる。
通常のjavascript部品と異なり、サーバー側でイベントをキャッチできるので、一件便利なように思えるが、WinFormと違ってボタン毎のイベント制御ができない。リボンで一つのイベントである。
そのため、リボン配下のどのボタンをクリックした場合でも、サーバーにイベントが発生するため、画面がリロードし、チカチカしてしまう。どうも気に入らない。

そこで、ボタン毎にイベントが発生できるよう裏技を利用する。

手順は以下の通り

①サーバーにイベントを送るためのダミーボタンを作成する。
↓
②リボンボタン実行時のクライアントイベントを実装する。
↓
③サーバーイベントを実装し、クライアントイベントの情報を取得する。

１．ダミーボタンの作成

サーバーにイベントを送るためのダミーボタンを作成する。画面からは表示されないよう、非表示にしておく。また、どのリボンボタンが押されたか判別できるよう、リボンボタン名を格納するhiddenオブジェクトを作成しておく。
※当初はhiddenオブジェクトではなく、ダミーボタンのTextに設定していましたが、クライアントからは設定されないようです。DevExpress社のASP.NETでは、クライアント側で設定できない項目が多くあるみたいです。TreeVewのノードも追加できませんでした。

WebForm.aspx

    <form id="form1" runat="server">
        <input type="hidden" name="hidden1" value="value1" /> 
        <dx:ASPxButton ID="ASPxButton1" runat="server" ClientInstanceName="button1" ClientVisible="True" OnClick="ASPxButton1_Click" 
                       Text="ASPxButton" AutoPostBack="False" EnableClientSideAPI="True">
        </dx:ASPxButton>
    </form>

<dx:ASPxButton ID="ASPxButton1" runat="server" ClientInstanceName="button1" ClientVisible="True" OnClick="ASPxButton1_Click"

Text="ASPxButton" AutoPostBack="False" EnableClientSideAPI="True">

</dx:ASPxButton>

</form>

２．リボンボタン実行時のイベントを実装

リボンボタン実行時のイベントのjavascriptに、リボンボタン名を設定と、ASPxButtonのクリックイベントを発火させます。

WebMap.js

function OnRibbonButtonClick(s, e) {
    var text = e.item.name;
    if (text == 'rddbiPointLayer' || text == 'rddbiStdLayer')
    {
        // リボン配下のボタン名を設定
        document.forms.form1.hidden1.value = e.item.text;
        button1.DoClick();
    }
}

function OnRibbonButtonClick(s, e) {

var text = e.item.name;

if (text == 'rddbiPointLayer' || text == 'rddbiStdLayer')

{

// リボン配下のボタン名を設定

document.forms.form1.hidden1.value = e.item.text;

button1.DoClick();

}

３．サーバーイベントを実装

サーバー側に、ダミーボタンのクリックイベントを実装し、クライアントのリクエストからリボンボタン名を取得する

WebForm.aspx.cs

    protected void ASPxButton1_Click(object sender, EventArgs e)
    {
        var txt = Request.Form.Get("hidden1");
        if (txt == "電子国土基本図（標準地図）")
        {
            TreeViewNode bnodes = this.ASPxTreeView1.Nodes[1];
            var bnode = new TreeViewNode();
            bnode.Checked = true;
            bnode.Name = "tvnStdLayer";
            bnode.Text = "電子国土基本図（標準地図）";
            bnode.Image.IconID = "maps_defaultmap_16x16";
            bnode.DataItem = "";
            bnodes.Nodes.Add(bnode);
        }

        if (txt == "レイヤ削除")
        {
            var node = this.ASPxTreeView1.SelectedNode;
            this.ASPxTreeView1.Nodes[1].Nodes.Remove(node);
        }
    }