ブログBLOG

皆様こんにちは、インフォシェアの小高です。

Nintex関連の連載記事です。今回はNintex Forms でJavaScriptを用いてユーザープロファイルを取得して表示してみる方法をご紹介します。
連載記事（Nintex）の目次はこちらから。

———————
これまで、列の表示非表示の制御を中心にNintex Formsをご紹介してきました。今回どうしようかと考えたのですが、せっかくJavaScriptを使用するわけですから、ちょっと楽しいというか、よくある例を取り上げるのが良いですよね。

というわけで、ユーザープロファイルを取得して画面に表示することにしました。JavaScriptを用いての列の表示非表示制御は、またの機会に取り上げますね。

まず、ベースとなるFormを用意します。これは適当ですが下記のようにしています。画面上部に２つの1行テキストありますが、ここにユーザープロファイルから取得した、ユーザー名と所属を表示します。

そのうちの１つの設定です。「JavaScript変数にクライアントIDを保存」をはいにしています。そして「クライアントIDを保存するJavaScript変数名」にUserNameIDと入力しています。個人的には、これができるのがNintex Formsの最大の特徴といってもよいと思います。この変数名の変数にコントロールのIDが格納されるのですね。これ非常に重要です。

同じくもう一つのコントロールも設定します。「クライアントIDを保存するJavaScript変数名」はDepartmentIDとしています。

はい、では次にJavaScriptを記載します。場所はForm自体の設定です。下図にある「カスタムJavaScriptに含める」と言うのは、外部スクリプトファイルの指定です。

今回は、SharePointが用意してくれている「SP.UserProfiles.js」とjQueryを用いてします。あとひとつ（up.js）は、今回の処理を記載したものです。なお、jQueryは別に必須ではありません、コードの記載が若干楽になるので、私はいつも使用しちゃっています。

また、「カスタムJavaScript」と書いてあるところにも何か（下記）書いてあります。

_spBodyOnLoadFunctionNames.push('load');

これはご存知の通り、フォームのLoad時に自作のload関数を実行するという指定です。Nintex Formsは、この「カスタムJavaScript」に独自のスクリプトを記載します。ただ非常に狭い枠ですし、使いにくいので私は上記のように、必ず外部のファイルにしちゃいます。

ちなみに、外部のファイル置き場ですが、今回は「_layouts/15/demo」なんてしてます。もちろんドキュメントライブラリなどでも構いません。

で、メインとなる外部のJavaScriptファイルですが、長くなりますし、コード自体に興味のない人もいるかもしれませんので最後に記載します。まず実行結果を紹介しますね。

こんな感じのプロファイルです、ここの氏名と所属を取得してます。

新規フォームを起動するとこんな具合ですね。をを、ユーザープロファイルの値が表示されています！

じゃあ、表示フォームやエディットフォームはどうなるの？と疑問に思う方もいるかもしれません。ご安心ください、表示することも非表示にすることも、どうとでもなります。このあたりの話はどこかの機会で紹介しようかなと思います。

如何でしょうか？Nintex Formsを用いることで、ユーザープロファイルの値、、、と言うより、JavaScriptが使用できるので、実に多くのことが実現可能です。今回は単にデータを取得するだけですが、見た目の部分の変更なんかももちろん可能です。

では、また次回！

———————

最後にコード（up.js）の例を記載します。（懐かしいですねー、MSでエバンジェリストをやっていた時のブログ記事のようです。。。）上記の「クライアントIDを保存するJavaScript変数名」のUserNameIDとDepartmentIDを使用しているのがわかると思います。

また、コード自体「長い」と思う方が殆どだと思います。「この程度のことで毎度こんな長いコードを書いてられないYo！」とも思うかもしれませんが、こうしたコードは共通で使用するようにすればよくて、そうすればフォームには、「クライアントIDを保存するJavaScript変数名」のUserNameIDとDepartmentIDをセットしたコントロールを配置するだけですみます。その為に外部のファイルにしたという意味もあるわけです。

Nintex Formsを使用するということは、「共通のJavaScriptライブラリを如何に作成するか？」ということに尽きると個人的には思います。この点がこれまでのSharePointフォーム開発と一番異なる点ですね。

function load()
{
  window.setTimeout(function ()
  {
      SP.SOD.executeOrDelayUntilScriptLoaded(getUserProperties, 'SP.UserProfiles.js');
      getUserProperties();
   }, 256);
}

var clientContext
var peopleManager;
var myProperties;
var userProfileProperties;

function getUserProperties() {
    _getPeopleManagerObject();
}

function _getPeopleManagerObject() {
    clientContext = new SP.ClientContext.get_current();
    peopleManager = new SP.UserProfiles.PeopleManager(clientContext);
    myProperties = peopleManager.getMyProperties()
    clientContext.load(myProperties);
    clientContext.executeQueryAsync(_getuserProfilePropertiesObject, onRequestFail);
}

function _getuserProfilePropertiesObject() {
    var profilePropertyNames =["PreferredName", "Department"];
    var targetUser = myProperties.get_accountName();
    var userProfilePropertiesForUser = new SP.UserProfiles.UserProfilePropertiesForUser(clientContext, targetUser, profilePropertyNames);
    userProfileProperties = peopleManager.getUserProfilePropertiesFor(userProfilePropertiesForUser);
    clientContext.load(userProfilePropertiesForUser);
    clientContext.executeQueryAsync(_getUserProperties, onRequestFail);
}

function _getUserProperties() {
   $('#' + UserNameID)[0].value = userProfileProperties[0];
   $('#' + DepartmentID)[0].value = userProfileProperties[1];
}

function onRequestFail(sender, args) {
    alert("Error: " + args.get_message());
}