logo

Ajax NotesViewNavigator Object

For no other reason than I enjoy messing about with new stuff I started creating a kind of NotesViewNavigator "class" using, of course, AJAX. More specifically it uses JSON for data exchange and is meant to demonstrate how to use it with Domino and how cool it can be.

Although it started out merely as a proof of concept I got a little carried away with the whole thing. The outcome is quite pleasing though, with some really elegant-looking JavaScript code, such as this, which should self explain:

view.entries.each(
 function(entry){               
  new Insertion.Bottom("table-view-body",
        "<tr><td>"+entry.columns.join("</td><td>")+"</td></tr>");
 }
) 

View? Entries? Columns? What is all this Notes-like stuff in JavaScript?! Well, it's all generated back at the server, by a LotusScript agent, which churns out JSON-style text like this:

{
 name: "People By Date Registered",
 aliases: ["bydate"],
 total: 287,
 start: 1,
 count: 2,
 headers: ["Created", "Name", "Username"],
 entries: [
	{
	 	_unid: "4DF...E3B", 
		columns: [
				"6/16/2006",
				"Adeel Qureshi",
				"aqureshi"
			]
	},
	{
	 	_unid: "42C...B17",
		columns: [
				"6/15/2006", 
				"Jimmy the Meathead", 
				"jmeat"
			]
	}
 ]
}

Back at the browser it's really simple to transform this text in to an object called "view". You can then refer to things like the string view.name, the array view.entries or a value held in column 2 for entry 3 by view.entries[2].columns[1], the column title for which would be view.headers[1]. From there you can easily create a view-like table using DHTML, as in the code earlier. The idea is that you can pass any view to the Navigator form, via the URL, and the code will render its contents. The three views used in the example are just normal views and there's no trickery involved.

Is this useful? Probably not, but it's all a good example of using JSON with Domino, which was my goal when I began the exercise. If you did decide to use it you could do away with all the eye candy nonsense I put in there. Either way, it's a hell of a lot better than the Notes Java View applets.

Although it commits the cardinal sin of breaking the back button you can link to certain points within a view by adding start/count parameters to the URL. For example here's the "people by username" view showing 7 people per page and starting at entry 21.

Rough cut and download db to come. As ever, if you can't wait till then, mail me and I'll send the DB over.

Updated - 10 Jan '07: Download it here in lieu of an article.

Comments

  1. Nice example Jake, you can also look at SortableWidget from Dojo Toolkit.

  2. Hey Jake,

    While your on the JSON trip have a look at this - {Link}

    It does away with the need for AJAX and the subsequent cross domain issues by injecting a script tag directly into your page. This is very useful if you want to consume data / web service from another server / domain.

    I have been building a multi database notes search tool which produces a JSON based output which allows non Notes Intranets to easily mix in notes data.

    • avatar
    • Jake Howlett
    • Tue 20 Jun 2006 04:52 AM

    Egor. Sortable table scripts don't really "work" with Domino views. All they do is sort the rows in the browser. What a user might expect and how Notes typically behaves is that resorting by a column could/would mean that the rows currently in the browser are replaced by others from the server. This isn't what these widgets do and so they can be confusing and/or useless in a practical sense.

    When sorting is needed we're fairly restricted as to what we can do. Only standard Notes views allow us to do this. Which is a pain in ....

  3. Since JSON is generated by LotusScript you can add a NotesDocumentCollection sorting routine (search Lotus forum) to sort documents at server. And if you were doing it with XML you could (probably) get sorted docs by using XSLT and NotesXSLTransformer class.

  4. As for the cardinal sin of breaking the back button, I will try to find the code that someone wrote where they directly manipulate the browser history every time they make a page change from an ajax call.

    ah! here it is: {Link}

  5. @Jeff - Cheers!

    @Mark - If I read correctly, it's reliant on a Web Service hosted by Yahoo!, which may be an unacceptable dependency for some folks. I know, that's the paradigm intention of a web service, but the "what if Yahoo! changes their mind?" detractor may be too great for some.

    @Jake - cool. Great illustration of how Domino can almost directly be translated to the web. Makes me wonder at a total AJAX Notes client OSS project. :D That would be awesome. Just a library that replicated or exposed the LS "DOM" in the same way you have done a View would be an amazing contribution to the Domino world.

  6. @Jerry - you read it wrong. There is no depency on Yahoo, its a simple DOM manipulation to write a new Script tag into to the document after the page has been loaded.

    The article illustrates the no proxy required principle by calling an example Yahoo web service which offers JSON as a return type.

    This removes the need for an AJAX call which would typically bounce of some server side script which it then returns to the browser.

    The principal of consuming JSON data in the browser is the same its just the technique to go away and get it is different.

  7. Ahhh. My bad... eyes. ;)

    So, that's a bit like what you were doing with Domino as the intermediary. Cool.

    • avatar
    • Brian Miller
    • Tue 20 Jun 2006 01:17 PM

    I did something like this fairly recently. I used a Java agent, along with the java code from json.org to generate all the things you'd need for manipulating a database from the browser.

    The tough part wasn't getting it to work, it was filling out the edges. Sane error handling, etc.

    • avatar
    • Michael
    • Tue 20 Jun 2006 01:57 PM

    I've seen references out there for non Domino XML --> JSON conversions. For Domino, it would chew up cycles, but has anyone tried this approach using ?ReadViewEntries along with it's extra arguments (more flexibilty) and doing a server-side XML-->JSON conversion using XSL?

    I see over at openntf.org that some have tried, but there were some authentication issues with the code they were using. I could see the benefits of adding sort options on the column headers which would do a true Domino style sort. Add in some category support (a la twisties) which would hide/show DIV tags and voila. It sounds too easy, so it must not be possible or someone would have done it already. I'll report back with the disaster story.

    • avatar
    • Michael
    • Tue 20 Jun 2006 02:13 PM

    Jake,

    You could just do a follow-up to the {Link} article and spiff that up for the JSON conversion.

  8. @Mark Barton's 2nd reply - I still not 100% on this one. I understand that it is not dependant on yahoo, but it IS dependant on the called website / web service returning JSON for consumption? Is my interpretation of this correct?

    If not, can the same DOM script injection technique be used to return XML or even simple HTML (instead of JSON). Otherwise this is limited to calling webservices etc that have the ability to return JSON.

    • avatar
    • Clint
    • Wed 21 Jun 2006 03:52 AM

    Very impressed! And I Also apreciate the Ajax validation control on the person form... Um... Can we have the sample DB?

    Greetings from Geneva

  9. @Roger - The principle is to inject Javascript into a calling page - I believe this is the way alot of advertisments etc are inserted at runtime into web pages, so to answer your question, JSON is not required but Javascript is.

    So the Javascript can carry any data you want but it has to be valid Javascript in the first instance. What you need to do is have a Javascript function on your page which takes a string as a parameter, when the script tag is inserted into the page this will cause the script to fire straight away - say to an agent, this agent as its output (remember to remove the HTML tags), just prints out the JS function you want to call + the string value. The string value could be HTML or XML but the real value is in JSON which can be easily converted into a Javascript object which makes it easier to extract the data and hence output to the page.

    Thats propably clear as mud, if you want any more info just drop me an email.

  10. @Mark - thanks for that, now I understand. I was hoping we could use this script injecting technique as a way of getting around cross-domain issues when using AJAX to access other websites that are outside of our control. Looks like this isn't the case.

    • avatar
    • Jake Howlett
    • Thu 22 Jun 2006 02:21 AM

    Roger. You *can* use injections to get round cross-domain issues.

  11. Jake. Apologies if this has taken us away from the original topic, but how?

    I am currently using AJAX (via prototype.js) to call another website, which is outside of my control. I then I parse the returned HTML string using JS, for example doing such things as hiding certain links etc from the returned page, and dropping it into a div on my webpage. This works except for the cross-domain warning messages which is tolerated (barely) by the user.

    Mark's explanation suggests that the *other* website needs to be able to call a function on my page - his example is an agent that prints out the function on my page with the results passed as a string. This would be fine if I had control of the *other* website in my example. Again it is just a basic website returning basic HTML.

    Am I missing something here?

    • avatar
    • Jake Howlett
    • Fri 23 Jun 2006 04:21 AM

    Roger. See here

  12. Do you have some example file?

  13. Where can we find this example?

    • avatar
    • Shyam
    • Tue 3 Oct 2006 04:08 PM

    Where can i find the db download for this article. If not published yet, can you send me the rough cut please.

    • avatar
    • Jake Howlett
    • Thu 5 Oct 2006 05:24 AM

    It's in the mail to you Shyam...

  14. Where can i downlaod the db for this article? Could you send me the rough draft if it is not publicly available?

  15. Please send me database to my e-mail account. It will be a great help in advising Industry that Domino is still better solution over other Technoloty.

  16. Hey !!

    Sounds good.

    Could you mail me the DB Example ..

    Though i would also like to know how it performs with view with categories.

  17. Hello Jack,

    I wonder, why you need to call an agent to generate the JSON, why don't you use directly the view data in the JSON format ?

    Greetings.

    • avatar
    • Jake Howlett
    • Tue 16 Sep 2008 04:36 AM

    Simple Pierre. I don't like the JSON produced by Notes. Also I still code for customers on Domino 6.

Your Comments

Name:
E-mail:
(optional)
Website:
(optional)
Comment:


About This Page

Written by Jake Howlett on Tue 20 Jun 2006

Share This Page

# ( ) '

Comments

The most recent comments added:

Skip to the comments or add your own.

You can subscribe to an individual RSS feed of comments on this entry.

Let's Get Social


About This Website

CodeStore is all about web development. Concentrating on Lotus Domino, ASP.NET, Flex, SharePoint and all things internet.

Your host is Jake Howlett who runs his own web development company called Rockall Design and is always on the lookout for new and interesting work to do.

You can find me on Twitter and on Linked In.

Read more about this site »

Elsewhere

Here are the external links posted on the same day.

More links are available in the archive »

More Content