Domino Keyword Lookups, jQuery & JSON

In Domino 8 it became possible to return a view in JSON format using &outputformat=JSON querystring parameter.

Here’s a simple view in Notes:

Here is what the JSON looks like:

{
  “@timestamp”: “20090303T123231,91Z”,
  “@toplevelentries”: “3″,
  “viewentry”: [
    {
      "@position": "1",
      "@noteid": "8000000C",
      "@children": "4",
      "@descendants": "4",
      "@siblings": "3",
      "entrydata": [
        {
          "@columnnumber": "0",
          "@name": "Index",
          "@category": "true",
          "text": {
            "0": "Option A"
          }
        }
      ]
    },
    {
      “@position”: “1.1″,
      “@unid”: “84FE562575501BE88025755F0031E1B1″,
      “@noteid”: “8F6″,
      “@siblings”: “4″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "textlist": {
            "text": [
              {
                "0": "Choice A1"
              }
            ]
          }
        }
      ]
    },
    {
      “@position”: “1.2″,
      “@unid”: “84FE562575501BE88025755F0031E1B1″,
      “@noteid”: “8F6″,
      “@siblings”: “4″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "textlist": {
            "text": [
              {
                "0": "Choice A2"
              }
            ]
          }
        }
      ]
    },
    {
      “@position”: “1.3″,
      “@unid”: “84FE562575501BE88025755F0031E1B1″,
      “@noteid”: “8F6″,
      “@siblings”: “4″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "textlist": {
            "text": [
              {
                "0": "Choice A3"
              }
            ]
          }
        }
      ]
    },
    {
      “@position”: “1.4″,
      “@unid”: “84FE562575501BE88025755F0031E1B1″,
      “@noteid”: “8F6″,
      “@siblings”: “4″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "textlist": {
            "text": [
              {
                "0": "Choice A4"
              }
            ]
          }
        }
      ]
    },
    {
      “@position”: “2″,
      “@noteid”: “80000010″,
      “@children”: “4″,
      “@descendants”: “4″,
      “@siblings”: “3″,
      “entrydata”: [
        {
          "@columnnumber": "0",
          "@name": "Index",
          "@category": "true",
          "text": {
            "0": "Option B"
          }
        }
      ]
    },
    {
      “@position”: “2.1″,
      “@unid”: “866C6FA4AEA492158025755F00328A60″,
      “@noteid”: “8FA”,
      “@siblings”: “4″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "textlist": {
            "text": [
              {
                "0": "Choice B1"
              }
            ]
          }
        }
      ]
    },
    {
      “@position”: “2.2″,
      “@unid”: “866C6FA4AEA492158025755F00328A60″,
      “@noteid”: “8FA”,
      “@siblings”: “4″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "textlist": {
            "text": [
              {
                "0": "Choice B2"
              }
            ]
          }
        }
      ]
    },
    {
      “@position”: “2.3″,
      “@unid”: “866C6FA4AEA492158025755F00328A60″,
      “@noteid”: “8FA”,
      “@siblings”: “4″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "textlist": {
            "text": [
              {
                "0": "Choice B3"
              }
            ]
          }
        }
      ]
    },
    {
      “@position”: “2.4″,
      “@unid”: “866C6FA4AEA492158025755F00328A60″,
      “@noteid”: “8FA”,
      “@siblings”: “4″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "textlist": {
            "text": [
              {
                "0": "Choice B4"
              }
            ]
          }
        }
      ]
    },
    {
      “@position”: “3″,
      “@noteid”: “80000014″,
      “@children”: “1″,
      “@descendants”: “1″,
      “@siblings”: “3″,
      “entrydata”: [
        {
          "@columnnumber": "0",
          "@name": "Index",
          "@category": "true",
          "text": {
            "0": "Option C"
          }
        }
      ]
    },
    {
      “@position”: “3.1″,
      “@unid”: “B6C86E0C587E08CB802575620031CA0F”,
      “@noteid”: “8FE”,
      “@siblings”: “1″,
      “entrydata”: [
        {
          "@columnnumber": "1",
          "@name": "Choice",
          "text": {
            "0": "Choice C1"
          }
        }
      ]
    }
  ]
}


Using jQuery and its incumbent JSON AJAX methods we can return data from the view and process it.
Below is a simple form which has 2 select option drop downs on it:

When the User chooses an Option from the ‘Option’ drop down, a set of choices specific to the selected option need to be offered in the ‘Choice’ field.

Here is the code from the JSHeader

function Option_changed()
{    
    //URL to the view with the restricttocategory set to the selected choice
    var url = dbpath + ‘/keywords?readviewentries&outputformat=json&restricttocategory=’ + $(‘#Option option:selected’).text()
    //Select object
    select = $(‘#Choice’)                    
    //Default option
    options = ‘– Please select –’
    //jQuery AJAX call to return JSON
    $.getJSON(url,function(data) {    
        //Check if we have any rows
        if(data.viewentry){
            //Loop through the rows
            $.each(data.viewentry, function(i, item){        
                $.each(item.entrydata, function(i, item){
                    //If the column contains multi-value
                    if(item.textlist){
                        //Loop through the multi-value column data                    
                        $.each(item.textlist, function(i, item){
                            //Loop through the text values
                            $.each(item, function(i, item){    
                                options += ‘’ + item[0] + ‘’
                            })                        
                        })                        
                    } else {
                        //No multi-value so just grab the text
                        $.each(item.text, function(i, item){
                            options += ‘’ + item + ‘’
                        })
                    }
                })
            })
            //Loop through the columns
            select.html(options)
        }
    })
    //
    $(‘#Choice’).html(options)        
}