tyoshikawa1106のブログ

- Force.com Developer Blog -

SFDC:カスタムボタンのjavascript処理でCSSを読み込む方法

f:id:tyoshikawa1106:20140819170919p:plain

カスタムボタンのjavascript処理でJSファイルを読み込みたい場合は、{!REQUIRESCRIPT}関数が用意されているのでそれを利用することで読み込めます。


ですが、CSSファイルの読み込みには使うことができないため、jQueryUIなどでCSSの読み込みが必要な場合に困ったことになります。


この問題の解決方法について海外の開発者がブログで公開していました。次の処理でCSSを読み込むことができるみたいです。

// CSSのURLを引数にrequireCssFileを呼び出す。
requireCssFile('CSSファイルのURL');

// PageのheadにCSSの情報をセットする
function requireCssFile(filename)
{
var fileref = document.createElement('link');
fileref.setAttribute('rel', 'stylesheet');
fileref.setAttribute('type', 'text/css');
fileref.setAttribute('href', filename);
document.getElementsByTagName('head')[0].appendChild(fileref);
}

この処理を利用することでCSSを読み込ませることができます。カスタムボタンをクリック時にjQueryUIを利用したポップアップ画面を表示したりなどいろいろな使い方ができるようになります。


この方法はこちらのブログで紹介されていました。記事内で紹介されていたjQueryUIを利用したポップアップ表示のサンプルもすごく参考になりました。サンプルはそのままDeveloper環境で動かすことができたので自分の環境で試してみるとおもしろいと思います。

Infallible Techie: How to create popup by clicking a custom button in a standard page layout in Salesforce?

f:id:tyoshikawa1106:20140819172029p:plain