1

セルがホバーされたときにツール ヒントを表示するためのより効率的な方法はありますか? 構造属性を使用してデータグリッドをフォーマットします。html タイトル属性を使用するのではなく、フォーマッタを使用して dijit ツールチップを表示する方法はありますか。

これは、ツールヒントが表示されている列です。

    var subscriberGridLayout = [        
       {    
            name: " ",
            field: "ExpirationDate",
            formatter: function(value){
                if(value){
                    expDate = formatDateIE(value);
                    return toolTip();
                }
                else
                    return " ";
            },
            styles: "text-align: center;",
            width: "30px"
        },

イメージ タグを介してツールチップ アイコンを表示する関数を次に示しますが、dijit ツールチップの代わりに、単に html のタイトルを使用してポップアップを表示します。

    function toolTip(){
        src = "'/Subscriber/resources/images/icons/icon_error.gif'/>";
        if(dojo.date.difference(today, expDate) <= 0 ){
            message = "Credential expired.";
            return "<img title='"+ message + "' src=" + src + "";
        } else if(dojo.date.difference(today, expDate) <= 60) {
            message = "This Subscriber will expire in " + dojo.date.difference(today, expDate) + " days."
                        + "&#10; &#10;To prevent an interruption in the Subscriber&rsquo;s access, please sumbit a request to " + 
                            "renew the Subscriber within 30 days of the expiration date.";
            return "<img title='"+ message + "' src=" + src + "";
        } else {
            return " ";
        }

    }
4

1 に答える 1

4

私は次のようなことをします：

new Tooltip({
    connectId: grid.domNode,
    selector: "td",
    getContent: function(matchedNode){
        return matchedNode.innerText
    }
});

ウィジェットの生成された DOMをgrid.domNode取得できます。selectorグリッドはテーブル構造を生成するため、およびgetContentプロパティを使用してセルを取得できます。

Dojo ウィジェットの内部構造をいじっているので、これは実際には正しい方法ではないと言わざるを得ません。DOM 構造としてテーブルを使用しないと決定した場合、コードは機能しません。

しかし、これを達成するためのより良い方法はないと思います。最終的には、常に Dojo セルを DOM ノードに変換する必要があります (ツールチップは DOM ベースであるため)。もちろん、各セルにツールチップを接続することもできますが、以前に試してみたところ、少しバグがありました (ツールチップがポップアップしない場合がありました)。

また、実際の例を示すためにJSFiddleも作成しました。

于 2013-05-02T21:47:08.767 に答える