Detecting the Current User’s Regional Settings with jQuery

I noticed a nice little trick going by in my Twitter feeds today.
2014-08-20_19-09-43I’ve always wanted to know how to do this. Displaying the right formats for dates and times as well as the right offset from UTC is a real challenge from the client side. There’s a fantastic library called Moment.js that I use on just about every project these days, but it only does the full job if you know the user’s locale and timezone.

The post on StackExchange gave a little snippet of script which came from an old MSDN Forums post from 2009. Kudos to Peter Holpar for the original idea.

The script basically screen-scrapes the values from the Language and Region settings page. I don’t mean that disparagingly at all; screen-scraping is how the SPGetCurrentUser function in my SPServices works. If it gets the job done and is reliable, the old art of screen-scraping – or should we call it plumbing the DOM with AJAX? – is just great.

Note that you’ll need to have jQuery loaded to use its AJAX function.

Here’s the script as-is from the StackExchange post. It was originally intended for SharePoint 2010.

var url = ctx.HttpRoot+"/_layouts/regionalsetng.aspx?Type=User";
        var lcid  = $(this).attr("value");
        var cultureInfo  = $(this).text();

I just tested it out in SharePoint Online on Office365 and this is the version that works for me. Note that I simplified the jQuery selectors to look just for the important ending text in the name attribute. I’ve also re-scoped the variables so that they are available outside the $.get call. If you want to use this snippet, you’ll probably need to adapt it for your environment. The alert at the end is jut there to show you that it works.

var url = _spPageContextInfo.webAbsoluteUrl+"/_layouts/regionalsetng.aspx?Type=User";
var lcid, cultureInfo, timeZone;

  $(data).find("select[name$='LCID'] option:selected").each(function(){
      lcid  = $(this).attr("value");
      cultureInfo  = $(this).text();
  $(data).find("select[name$='TimeZone'] option:selected").each(function(){
    timeZone  = $(this).text();

  alert(lcid + "::" + cultureInfo + "::" + timeZone);

Cold Calling Doesn’t Work, Nor Does “Cold Emailing”

Here’s a new one in my email inbox this morning: “As per my discussion with you receptionist, I have enclosed…” Yeah, my receptionist, which I don’t have.

That was in an email from a company some would consider “legitimate” in the SharePoint space. They have a set of products for SharePoint that may work well (I have no first hand knowledge), but it doesn’t matter. By sending me that come-on via LinkedIn mail they are guaranteeing that I will actively stay away.

People, cold calls don’t work! It doesn’t matter whether you send them via LinkedIn, email, voice mail, whatever. Scatter-shot approaches to sales and marketing in the 21st century just can’t yield enough value to continue doing it.

Cold-CallingFrom “Why Cold Calling Is A Waste Of Time (And What You Should Be Doing Instead)“:

 A little internet surfing revealed that the stats for cold calls were not encouraging:

And that’s for cold calls in the traditional sense: picking up a phone and dialing a number. Email response rates are so much lower.

Unfortunately, sending bits is way too cheap. The bad guys have figured that out. Just a sampling from my Junk E-Mail and Spam folders this morning:

RE: TO WHOM IT MAY CONCERN: Sir/Madam, My name is Brown Morgan, Esq. I am a Barrister, Solicitor and Financial Advocate based in the Republic of Ghana West Africa. I brought a Business Deal at your doorstep for your consideration and hereinafter to confirm if you will be willing and interested to participate in the Business Deal. My client has privately acquired the sum of US$88 million and whereas need someone that is trustworthy to receive the aforesaid funds on condition that my client’s information will not be disclosed as the Original Owner of the Funds. Send me your telephone numbers for discussion of this offer in full details including your commission for your participation. Yours Truly, Brown Morgan. Barrister-At-Law

Have you been searching for a Business loan, Company loan or loan to pay off bills? This is to inform you that We Offer all kinds of loans at 3% interest rate.

Mr. Edgar Walker of compensation and finance house, as he is our representative in United State, contact him immediately for your Compensation payment of $500,000.00 USD (Five Hundred Thousand United States Dollars) Funds will be release direct to you in accordance with legal clearance and procedure.

Рассылки по любым предприятиям  Большой выбор аудиторий  Обращайтесь по любым вопросам: (Ч 9 5 ) 54 5   1 4 92

No idea on that last one. Am I likely to dial that phone number? Ever?

Blasting out thousands or even millions of emails has about the same cost as sending out one: almost nil. Therein lies the problem that marketers today face. There’s too much noise and chaff and it’s too easy to do the wrong thing.

After I attend a conference, something similar happens. I get a slew of emails saying things like:

  • “Thanks for stopping by our booth” when I haven’t stopped by any booth at all
  • “We enjoyed the conversation we had with you about our products” when I didn’t talk to a single person at that company
  • “Because you attended conference XYZ, we’re sure you’d be interested in…” even when there’s no connection to what I actually do in my business

The “legitimate” marketers are just riding the “free bits” tide. There’s no shortage of articles out there with titles like “5 Secrets to Cold Calling Success” or “Secrets To Successful Cold Calling”. Those articles are the cold calling of the blog post world, trying to suck you into following a practice that the writer can profit from. That’s an even more circuitous cold calling approach that probably leads to an even *lower* success rate.

Looking forward to having a long lasting business relationship with you and your Organization.

If I thought you had the least idea about who I am or what my organization does, maybe, just maybe I might read your email.

I’ll leave you with a few last thoughts on this. Do you want to contact people who may feel the way I do about it and even take the time to rant about it as I’m doing here? Or do you want to carefully seek out people who truly might buy your product or at least listen to your pitch? In this age, your “social presence” is based on the sum of every one of the interactions you have with potential customers, no matter how inconsequential those interactions may seem. How do you want your potential customers to think of you?


Australian SharePoint Conference Wrap Up

I wrote this post about the Australian SharePoint Conference on the plane heading to the New Zealand SharePoint Conference but never got around to publishing it. The New Zealand conference was every bit as great, but I didn’t do a write up of that one. After the two conferences I met my wife and son (The Dude) in Hanoi and we spent a little over two weeks touring Vietnam and Cambodia. Side note: this is a must-do trip if you can afford the time and money (it’s cheap once you get there). Feel free to ping me for suggestions!

Touring the Bayon temple reconstruction site at Angkor Thom

Touring the Bayon temple reconstruction site at Angkor Thom

20140714_223216733_iOSThe Australian SharePoint Conference was held in a great facility, the Hilton Sydney. As with all conferences there were a few hiccups (Why can’t wireless just *work*!?!?) but all in all, the conference was a smashing success.

This was my first trip Down Under, and even my first trip across the International Date Line. I was worried that the time difference would sideline me completely, but luckily, it really wasn’t a problem. Having 21 hours in the air on the way there gave me plenty of time to rest up on the trip.

When I speak at conferences, I try to go to as many sessions as I can. It’s one of the biggest perks of being a speaker: I get to see and hear some of the best minds in SharePointlandia explain how they do things with SharePoint.


The keynote is always fascinating at these conferences and this one was no exception. Mark Rhodes (@MrHodes), Brian Farnhill (@BrianFarnhill), and Paul Culmsee (@PaulCulmsee) did a yeoman’s job on this one. Paul was fighting a head cold, but rose to the occasion in spite of it.

The main themes of the keynote were connections between people both inside and outside organizations and knowledge management. Both topics are near and dear to my heart; I’ve been on the knowledge management bandwagon since the mid 1990s. Even having the chance to meet Paul – one of my heroes in this space – was a true pleasure. It’s not easy to communicate from the other side of the planet.

Mark kicked things off by giving us some context for the conference itself. He had some great points about how our use of technology is changing rapidly from caring about what kind of devices we have to what they can do for us. How many of us know or care what chip runs our tablets or phones anymore? Rather than seeking out a particular chip or memory profile, more and more we’re seeking devices that can help us Get Things Done. (As I type this post on my Surface 3 Pro, I’m demonstrating this trend. I wanted a device that I could use while travelling for the two conferences and my vacation in Vietnam afterward without breaking my back, and that would allow me to do real work. I didn’t care so much about the mHz of the processor.)

As Mark pointed out, Moore’s Law is – in a sense – giving way to Metcalf’s Law. While the power of processors has increased, the value of our networks has increased. When we have two people in our network, we have one connection. Three people makes it three connections, and so on. As the number of people in the network increases, the value of that network increases, as does its complexity. Amongst the 400 or so attendees of the conference in Sydney, we had more than potential 80,000 connections.

Why does that all matter? Well, as Mark said, the conference – like any conference – was so much more than simply a bunch of great sessions. Taking advantage of those connections in the hallways, at Las Vegas night, or in the hotel lobby is at least as as valuable as the sessions themselves. Sessions are important, but a bigger conference benefit is the connections – a network of like-minded peers.

Mark then introduced Brian & Paul. I wish I could have captured everything these two covered because these were so many excellent themes in their talks.

Paul started out by talking about a new age of information rage. We have information and data coming at us from all angles at almost all times. The average Australian employee spends 2.5 days of the week doing their job. The rest of the time is spent navigating a virtual forest of information (Enough already: information overload – Sydney Morning Herald). That’s a powerful statistic. Half the time, folks in Australia are doing things that *don’t* lead to job task completion. You will probably agree that this phenomenon impacts you as well as you deal with the emails you get, blog posts you read (including this one!), political posturing, etc. required in the modern organization.

Information storage and effective retrieval is such a problem then an organization like NASA has “forgotten” how to go to the moon. The people who made it happen have retired and these is no good repository of what they knew or learned from the experience (Lost Knowledge: Confronting the Threat of an Aging Workforce by David Delong). Imagine! Something as important to our shared history as how the rockets worked to get a team of people to the moon has been lost. think about how much of the less famous – yet no less important – information inside your organization vanishes every day.

As Paul said, it’s time to re-imagine how we approach information. Now, more than ever, we need contextually relevant search and knowledge delivery. Somewhere in the sea of information that’s around us, that bit that we really need is available, but we have to be able to find it.

Next, Brian talked about Microsoft’s new technology called Delve (previously Project Oslo). By using the “Office Graph”, Delve can start to surface information we need to accomplish things, in many instances before we know we need it. This is where Mark’s thoughts about connections came back in again. The machine learning behind Delve watches our activity and shows us content from our connections that may be useful to us. It’s no longer enough to simply show me content that someone I follow generates. Many times, the valuable nuggets are out there created by like-minded people or connections of connections of connections. Delve watches for signals based on what I do so that it can show me content that is important to me as I do my job, and machine learning drives what content any one person sees based on their network of connections.

We both generate and consume both public and private signals, though. This concept is evident in places like Facebook, Google+, and Yammer, where we can choose how we want to “scope” our content publishing and searching. Delve takes this public versus private sort of content into consideration as it chooses what to show you. (Yes, I’m getting more and more anthropomorphic in describing Delve. Spooky, perhaps, but also really cool. It’s not Skynet – yet.)

We make both formal (organizational hierarchy) and informal (projects, ad hoc work) connections. This has always been the case, but with advances in computing power and software, capabilities like Delve are starting to connect dots that we can’t even see in new and fascinating ways. We see the obvious things, like content “Created by Me”, but also much more subtle things, like content “Presented to Me”.

Delve works on top of SharePoint as a platform, but we can also seed the Office Graph with our own sources via a powerful API. Thus data entities that are relevant to our own organizations can become part of what Delve presents. Things like support tickets, a product catalog, work reviews, CRM, etc. will become part of Delve’s domain as we wire them up. We will be able to feed whatever content we want into the machine learning engine – Office-based content, organizational content, and even external content.

Delve will be available in Q4, 2014. I, for one, am looking forward to the possibilities.

Paul jumped back in to wrap things up. All this technology is grand, but as Paul said, much of the important information in an organization travels along the informal jungle paths. Places like the proverbial water cooler or coffee station (as Paul likes to call it, “acoustic Yammer”) is really the #1 knowledge management capability in our toolkit. The best way to find out what worked – or didn’t work – in the past is to ask the people who lived it. We need to find out what people remember and come up with a way to capture and quantify it.

GlymaSeven SigmaPaul’s company Seven Sigma has developed a different, but complementary product to do just that called Glyma. These are wicked smaht people solving wicked problems. For years, Paul has been doing mind mapping, which led to dialog(ue) mapping. Given that the best way to understand what works or doesn’t is by talking to people who have done it before, we need better ways to work with that information. A combination of our connections and our discussions leads to better knowledge management. In other words, finding the right people, handing them a beer, and letting them talk about what they know is where the gold is in them thar hills. As before, this concept isn’t actually new. We knowledge management -focused consultants have been cornering people – with or without the beer – to find out what they know for a long time.

Glyma gives us a platform in which to store that explicit knowledge from the source. Whether we have videos of people explaining something they know, legislative documentation, URLs to Web sites, or anything else we can capture electronically (even directions to a shelf in the local library is “electronifiable”), Glyma gives us both the storage mechanism and the mapping capability to let us make sense of it all.

Have you ever been told to watch a 90 minute video only to find that the only truly valuable bit of it to you was at minute 72? Have you ever waded through reams of documentation only to realize that looking at paragraph 3 on page 36 was exactly what you needed to do? In either case, what we need is a good index – or map – to the exact content we need. That’s what Glyma lets us do.

As you can see, the keynote really jazzed me up. Knowledge management has long been a passion of mine, and we’re heading into yet another evolutionary step in the possibilities it can provide. I can’t wait to see Delve in action – maybe even fed by Glyma – among other sources. While I love working within Sympraxis Consulting LLC – my own small company – this value proposition almost makes me yearn to be part of a big, knowledge-starved organization again. Almost. Well, not really.

Glyma Bonus

There was even a bonus for us at the conference. We were able to review some of the sessions which had been filmed at the conference that had been “Glyma-fied” using kiosks spread around the halls. This was a great way to show how the tool worked, and also let attendees “attend” sessions that might have missed. You can check out the Glymafied sessions at on this special Glyma site. You’ll need to log in with Facebook or Google+, but don’t freak out about that.

Sessions I Attended

  • From Data Platform to Knowledge Platform: Innovations in Leveraging Intellectual Capital Using SharePoint with Paul Culmsee (more Glyma!)
  • Introducing Project “Siena” with James Milne (@JamesMilne) (Very cool stuff. You should check out Project Siena.)
  • Melbourne Water Case Study: Engaging your Organisation in an Intranet Rebuild with Rebecca Jackson (@_RebeccaJackson)
  • Creating Responsive Designs for SharePoint 2013 with Brian Farnhill
  • Build Amazing Web Parts using JavaScript and Evolving your Code with any Versions of SharePoint with John Liu (@JohnNLiu) (as John said, 班门弄斧)
  • So What is this Newfangled Apps Model Anyway and Why do I Care? with Paul Culmsee
  • Integrating Yammer with SharePoint with Elaine van Bergen (@laneyvb) and Chris O’Connor (@GrumpyWookie)

Plus maybe others lost to me in the haze of traveling.

My Sessions

Oh, I also presented a couple of sessions.

The first was sort of an old standard for me, “SharePoint Solutions with SPServices”. In it, I give an overview of SPServices and how it works and also try to give a glimmer (Glyma?) of what one can use it to accomplish.

The other was “Creating Single Page Applications (SPAs) with SPServices”. This is a newer session for me. I’ve been building more and more applications that are primarily single-page applications – at least in the spirit of the term. I’ve been using KnockoutJS primarily, but in this session I talk about some of the other potential approaches as well. This session is more demo than slides, and I showed some of the cool stuff I’ve been doing in my client work.

I also was honored to be on the Ask the Experts panel at the end of the conference. (Obviously, very low standards.) Remember, adoption is not the goal. Trying to get people to use something that sucks is a waste of effort.

But Sure, There Was Fun

Party MakersOf course, you can’t get a bunch of SharePoint people together and expect everything to stay educational and dry. This is the bunch that invented SharePint, for gosh sakes. The conference had it’s own fun in the form of Las Vegas night on Tuesday after the sessions had wrapped up. Quite a few people got dolled up in Vegas attire and tried their fake luck at winning fake money. Based on the raucousness of the evening, the fact that the money was fake mattered very little in the fun quotient.

The other North American speakers and I also had time to make some mischief outside the conference venue. For many of us, it was the first trip to Sydney, so we did quite a bit of walkabout to see the sites, like the Sydney Opera House and the Sydney Harbour Bridge. Sydney is an interesting mélange of British, Asian, and world culture, but with that unique Australian aboriginal twist. If you want any Ugg products, Sydney is the place for you, as there seems to be a store selling Uggs just about every block downtown. We sampled really good food in the style of just about anywhere other than Australia: British pub food (fish and chips, meat pies).

Pig KnucklePerhaps the best meal – at least in my opinion – was the one we had on my last night in Sydney: German food at the Lowenbrau Bierhall. I had the pig knuckle, and of course you can’t go wrong with anything that was once attached to bacon.


ShareThePointFinally, I want to thank all of the conference organizers for their hard work on the Australian SharePoint Conference. The core team for the two conferences was Debbie Ireland (NZ), Nick Hadlee (NZ), Mark Rhodes (AU), and Dan MacPherson (AU). The hard work and excellent planning was very evident: the pre-conference communication was excellent, the use of technology was inventive (the conference agenda was made available as a OneNote notebook for easy reference and central update and we used Yammer extensively in the months leading up to the conference), the food was great, the Las Vegas night was a lot of fun, and on and on. Putting on a conference like this is far more work than most attendees realize, and this team does it exceedingly well.

Special thanks to Debbie Ireland for inviting me to speak at the two conferences in the first place. I was honored to do it, and it was extremely gratifying to have the chance to meet a number of people who love using SPServices in their day-to-day work with SharePoint.

Renegade Idea: Expose REST Endpoints in the SharePoint UI

Here’s an idea I had today based on a conversation I had with some of the other SharePoint MVPs: expose the REST endpoints and documentation right in the UI for those who have the appropriate permissions. It could be a little icon at the bottom of any page where there are relevant end points. All content is security trimmed anyway, so no one is going to see an endpoint they can’t use (though if they can fathom the docs they can know what endpoints there are available).

Think about it:

  • You’re on a List Settings page, and you can see the endpoint for that
  • You’re on a workflow status page…
  • You’re in Central Admin on the Create Site Collection page…
  • You’re on a Term Set Administration page…
  • You’re on a List View page…

All of the APIs are more obtuse than they need to be. In many cases, the docs are either very long-winded without explaining basic operations or just content stubs. By adding these direct connections from the matching UI pages, it would:

  • Satisfy the developer needs for easy to understand documentation
  • Educate appropriate [power] users about how to talk to the devs about what they want
  • Potentially get telemetry to Microsoft about what people want in the APIs and their docs

There’s far too much of the “I can’t look it up in the dictionary until I know how to spell it already” going on with the APIs in SharePoint in general – going back to the SOAP Web Services and beyond. The platform needs to be more open, not less. Adding these direct links to the REST endpoints and their docs would be an incredibly powerful step in that direction.

What do you think of this idea? It’s mine alone and even if it’s the best idea I’ve ever had (probably not) there no guarantee that it would make any sense to the Product Group. Leave a comment, though, and add your own thoughts about how to make the SharePoint APIs more usable.

If you think this is a good idea, vote for it on the Expose REST Endpoints in the SharePoint UI item on the Office Development UserVoice site.

This is a piece of art from a gallery in Hoi An, Vietnam showing a pig. As you can see, it’s even possible to make a pig look nice with a little creativity and work.

Using the Signature Pad jQuery Plugin with SharePoint & InfoPath

Have you ever needed to capture signatures in SharePoint forms? What about InfoPath forms? I’m betting many people have seen a need to do this but have balked at the cost or complexity of the available solutions.

A client of mine named Cody Sellers (@codyjsellers), who works for Mercom Corporation had just such a need. Mercom is a smallish company that didn’t want to spend tens of thousands of dollars on a “real” eSig solution. Cody did some research and found a great jQuery plugin and turned to me for help implementing it. In this case we’re working with SharePoint 2013 on premises, but this should work with any version of SharePoint with some modification.


The Signature Pad plugin comes from a clearly smart guy named Thomas J Bradley. Based on the work I’ve done with it so far, it’s well written with good documentation. Even better: it just plain works.

Signature Pad: A jQuery plugin for assisting in the creation of an HTML5 canvas based signature pad. Records the drawn signature in JSON for later regeneration.

The plugin allows you to capture signatures based on typed or drawn input and can be saved as JSON or a PNG image.

In our case, we wanted to be able to add a signature block at the bottom of multiple InfoPath forms. To make this work well, we decided that we would add the script into the master page. Yes, that may seen foolhardy, but a large majority of the work that is going to be happening in this Site Collection is filling out these forms.

Because of this, we needed a clear convention to follow in every form so that we could locate all of the signature fields (some forms have more than one) and add the signature pad capability reliably.

One of the hardest things about working with InfoPath forms client-side is that there are almost no sensible hooks in the emitted DOM. Everything is a .NET-like element id, like


Since those ids can change anytime you change the form, you really want to give yourself something more solid to hook into. (At least we know that InfoPath won’t change anymore and the basic form elements are constant!)

To ensure that we could easily add the signature pad to any existing signature fields, we wrapped each signature field in an InfoPath section with its ScreenTip set to “==Signature==”.

InfoPath section with its ScreenTip set to ==Signature==

InfoPath section with its ScreenTip set to ==Signature==

The logic works like this:

  • Check to see if there’s a div with its id ending in ‘XmlFormView’ – this is the container for an InfoPath form. If there isn’t one, do nothing.
  • Find sections in the form that have their ScreenTip set to “==Signature==”. Sections have a fieldset container, and the title is set to the ScreenTip value. In other words, any section with its ScreenTip set to “==Signature==” will be treated as a signature area by the code.
  • Find the input element inside that section. This is the field where we want to store the JSON representation of the signature.
  • If the input element has no value, render the signature pad for signing (new forms)
  • If the input element already has a value, show the signature it contains (edit and display forms)

We decided to store the JSON representation of the signature in a field in each InfoPath form. Since the JSON represents the vectors from an HTML5 canvas, it’s a nice, standard way to store it. Images would require some separate repository or further encoding to be stored in a text field. Since the plugin can both emit and reconstitute the JSON into a signature, it’s a good way to go.

We ended up with the code below for the simplest case. (It’ll get more complicated as we get into the business rules, but this post is about the technology to capture and display the signatures.) When we create a new item in the newifs.aspx form, the Signature column will be empty and thus we will show the signature pad. If there’s already a value in the field, then we’re on the edit or display form, and signing has already happened so we just display the signature we have.

I’ve added comments that hopefully make the code simple enough to follow. As with all code you read on the Web, this isn’t just a drop-it-in-and-it’ll-work thing – you’ll end up tailoring it for sure. (One would think I wouldn’t need these caveats, but…)

$(document).ready(function() {
    // Find the guts of the InfoPath form in the page
    var infoPathContainer = $("div[id$='XmlFormView']");
    // if there's no InfoPath form, then we have nothing to do here (escape early)
    if (infoPathContainer.length !== 0) {
// There's an InfoPath form in the page, so look for signature fields and set them up
function setupSignatures(infoPathContainer) {
    // The Signature "signature" in the form. This makes it easy to select the proper form elements
    var signatureSignature = "==Signature==";
    // The signature field should be inside a section with its tooltip=signatureSignature
    var signatureContainer = infoPathContainer.find("fieldset[title='" + signatureSignature + "']");
    // The Signature field is the lone input element in the section
    var signatureBox = signatureContainer.find("input");
    // We may have multiple signature fields in the form
    signatureBox.each(function() {
        var thisSignatureBox = $(this);
        // We need a reference to the fieldset which represents the section several times
        var thisSignatureFieldset = thisSignatureBox.closest("fieldset");
        // Clean up the display by hiding the field we're using to store the JSON
        // The signature data is the value of the signatureBox
        var signatureData = thisSignatureBox.val();
        // If there's no signature yet...
        if (signatureData === "") {
            // Add the appropriate markup to the page
            // Bind to the click event for the 'Ready to Sign' button
            thisSignatureFieldset.find(".signature-ready").click(function() {
            // Activate the signature pad in drawOnly mode
            var signatureArea = thisSignatureFieldset.find(".signature-box").signaturePad({
                drawOnly: true,
                lineTop: 125,
                output: thisSignatureBox,
                onBeforeValidate: function(context, settings) {
                    thisSignatureBox.focus(); // Needed to fire the change events bound to the field
                    thisSignatureBox.blur(); // Needed to fire the change events bound to the field
                    thisSignatureBox.hide(); // In case it becomes visible again
            // When the user clicks the button below the signature pad, validate
            thisSignatureFieldset.find(".signature-done").click(function() {
            // If we already have signature data, just show the existing signature
        } else {
            // Add the appropriate markup to the page
            // Activate the signature pad in displayOnly mode
                displayOnly: true
// Function to emit the markup for the signature pad in signing mode
function buildSignatureBox() {
    var signatureBox = "<div class='signature-box'>" +
        "<input class='signature-ready' type='button' value='Ready to sign'/>" +
        "<div style='display:none;'>" +
        "<ul class='sigNav'>" +
        "<li class='drawIt'><a href='#draw-it'>Sign Here</a></li>" +
        "<li class='clearButton'><a href='#clear'>Clear</a></li>" +
        "</ul>" +
        "<div class='sig sigWrapper'>" +
        "<canvas class='pad' width='700' height='150'></canvas>" +
        "<input type='hidden' name='output' class='output'>" +
        "</div>" +
        "<input class='signature-done' type='button' value='Capture signature'/>" +
        "</div>" +
    return signatureBox;
// Function to emit the markup for the signature pad in display mode
function buildSignatureDisplay() {
    var signatureDisplay = "<div class='sigPad signed'>" +
        "<div class='sigWrapper'>" +
        "<canvas width='700' height='150' class='pad'></canvas>" +
        "</div>" +
    return signatureDisplay;

Here are some screenshots from our proof of concept:

The form when it loads

The form when it loads

Ready to sign

Ready to sign



Signature displayed on the display form

Signature displayed on the display form

Snippet of the data that is stored for a signature

Snippet of the data that is stored for a signature