Build JSON from NotesView, support for multiple value fields

The problem

An old-fashioned NotesView can be a fast way to define JSON objects. Here is a xsnippet that give you some inpsiration.

If you have fields with multiple values then the formula does not work anymore. You want to store an array in the JSON.

The fix

The following formula checks if the desired output fields contains more than 1 value  and if so transforms it to an array if not, then you get a normal key:value pair returned.

_fld:=”refName”:”refSub”:”refStrength”:”refWeakness”;

json:=””;

@For(n :=1; n<=@Elements(_fld); n:= n + 1;

@If(
@Elements(
@GetField(_fld[n])
)>1;
json := json + @Transform ( _fld[n]; “_fn” ; “\”” + _fn + “\”:”) + “[” + @Implode(@Transform( @GetField(_fld[n]) ; “_fn” ; “\”” + _fn + “\”” ) ; “,”) + “],” ;
json := json +
@Transform (
_fld[n]; “_fn” ; “\”” + _fn + “\”:\”” + @Text ( @GetField ( _fn) ) + “\”” + “,”)
)
);
“{ \”unid\”:\””
+@Text(@DocumentUniqueID)+”\”,” + @LeftBack(json;1) + + “}”

Test

I added my formula to a column and calling several single and multiple text fields. Here is my output in a browser:

notesview-as-json

If I validate the json it says it is valid:

valid-json

I added my code to the XSnippets database.

Add 20 years of experience to your workforce

You can 20 years of experience within IBM Notes and Web development to your workforce by hiring me.

Interested? Read my curriculum vitae on LinkedIn: http://www.linkedin.com/in/patrickkwinten and get in contact.

I am happy to work WITH you !

Advertisements

Breadcrumbs using JQuery

Bob Balfe asked some time ago who is using JQuery for their Domino development projects. I hoped it was gonna rain with examples of implementation of JQuery plugins in Lotus Notes but so far it remains a bit quiet. So why not describe an example myself?

Figure: Screenshot from the website.

xBreadcrumbs is a nice plugin to JQuery to provide horizontal navigation. It uses an unordered list (UL) as source so when you provide that data dynamically with Notes data it becomes interesting.

In my case the customer wanted to have breadcrumbs on top of documents that are stored in a Notes view. Documents are categorized in a parent-response hierarchy so for each document I have to calculate the complete path from the opened document to its uber-parent (some points on that u) aka as ‘Home’.

Figure: Document location in Notes view.

Figure: Document location in breadcrumb.

Implementation

Download the zip file, extract it and upload the files in your Notes application.

Create a subform that you will embed on the form of your document. Add the following code to the subform:

<script type=”text/javascript” src=”../jquery-1.3.2.min.js”></script>
<script type=”text/javascript” src=”../breadcrumbs/js/xbreadcrumbs.js”></script>
<link rel=”stylesheet” href=”../breadcrumbs/css/xbreadcrumbs.css” />

<script type=”text/javascript”>
$(document).ready(function(){
$(‘#breadcrumbs-2’).xBreadcrumbs({ collapsible: true });
});
</script>

<style type=”text/css”>
.xbreadcrumbs {
background:#FFF none repeat scroll 0 0;
}
.xbreadcrumbs LI {
border-right: none;
background: url(../img/frmwrk/breadcrumb/separator.gif) no-repeat right center;
padding-right: 15px;
}
.xbreadcrumbs LI.current { background: none; }
.xbreadcrumbs LI UL LI { background: none; }
.xbreadcrumbs LI A.home {
background: url(../img/frmwrk/breadcrumb/home.gif) no-repeat left center;
padding-left: 20px;
}
/*  Custom styles for breadcrums (#breadcrumbs-3)  */
.xbreadcrumbs#breadcrumbs-3 {
background: none;
}
.xbreadcrumbs#breadcrumbs-3 LI A {
text-decoration: underline;
color: #0A8ECC;
}
.xbreadcrumbs#breadcrumbs-3 LI A:HOVER, .xbreadcrumbs#breadcrumbs-3 LI.hover A { text-decoration: none; }
.xbreadcrumbs#breadcrumbs-3 LI.current A {
color: #333333;
text-decoration: none;
}
.xbreadcrumbs#breadcrumbs-3 LI {
border-right: none;
background: url(../img/frmwrk/breadcrumb/separator.gif) no-repeat right center;
padding-right: 15px;
padding-left:0px;
}
.xbreadcrumbs#breadcrumbs-3 LI.current { background: none; }
.xbreadcrumbs#breadcrumbs-3 LI UL LI { background: none; padding: 0;  }
</style>

<script src=”../$a-get-bread-crumb?OpenAgent&breadcrumb=<Computed Value>&ul&view=$v-treeview&id=myCrumb&class=xbreadcrumbs&activecrumbclass=current”></script>

The source for my unordered list is the agent $a-get-bread-crumb.

The formula for the computed value is as followed:

@Text(@DocumentUniqueID)

The agent will use the Notes view ‘$v-treeview’, find the document by its document UNID and navigates via each parent all the way up in the Notes view. While doing so the required information to build the unordered list is collected.

By the way, the code for this agent was co-written by my collegue Tomas Ekström.

Reflection

In theory the breadcrumbs were displayed without any problem on the fly. However when moving into production with a database with more than 10.000 documents performance became a problem. It took about 3 seconds to collect the information and thereafter the complete document would be displayed.

Since the customer did not find such a load time acceptable BUT could no longer live without the breadcrumbs any longer I decided to place the subform instead of on top of the form to the bottom of the form and place it via CSS back on top of the document via absolute positioning.

The result is that the content of the document is displayed instantly and the breadcrumbs will follow a few seconds later. Not the nicest solution if you would ask me.

But for small websites (tested with 400 documents) the function works like a charm.

To end this post I will include the code for the agent + some script library.

Code

ULTreeFromView script

class CGI script

$a-get-bread-crumb

XPages development practices: developing a common Tree View Custom Controls

In an earlier article I wrote about displaying information from a Notes View in a Dojo tree dijit.

A scan via Google what others have been doing on this matter did not result in so much valuable information untill I found an article on IBM developerWorks … in chinese.

If you translate the page via Yahoo! Babel Fish you get some really odd result. However, if you translate the page via Google Translate you get a really good translation in a format that I can understand.

I wonder if IBM has ever released this article in English? I hope they do not find it a trouble if I make it available in a PDF format: developing a common Tree View Custom Controls

Unfortunately I haven’t had the time to test the article in a demo database, but if you have, please let me know…