#wffm

Recently I had an issue with a JavaScript in a Sitecore 8.2 update 3 installation that was throwing errors on some pages and not on others. I started comparing the different pages and realized that the error was only happening on pages with WFFM forms so I looked through the markup only to discover that there was a reference to an ancient jQuery v. 1.10.2 at the start of the page.

<script src="/sitecore/shell/Controls/Lib/jQuery/jquery-1.10.2.min.js" type="text/javascript"></script>

The odd thing is that there was another reference to a different jQuery file also added by WFFM right above that pointed to another jQuery v. 1.11.4.

<script src="/sitecore modules/web/web forms for marketers/scripts/jquery.js" type="text/javascript"></script>

Needless to say, having two different versions of jQuery loaded is never a stable situation and to make matters worse we were also loading our own jQuery v. 3.2.1 on top of everything else and as they say, three is a crowd and of course that was the root of the issue.

I still have not really figured out why WFFM would load two different versions of jQuery and even further, why it is using such ancient versions. I did some additional digging and discovered that WFFM was also loading another dynamic script through WebResource.axd right after the jquery-1.10.2.min.js file so I looked at it and it was referencing some data attributes on the form fields. That led me suspect that it had something to do with client side validation as it looked a lot like the data attributes that was added with the unobtrusive form validation that was introduced in asp.net 4.5.

By now I was looking at my options for solving this issue. It looked like I had three different ways to try to solve the issue. My first option was to replace the jquery-1.10.2.min.js file with a blank file and the second option was to replace the contents of the file with either jQuery v. 1.11.4 or 3.2.1 to see if this would make everything work together. However, these options did not really seem safe, as it was just as likely to break something in the WFFM client-side validation. I am guessing that they are including an ancient jQuery version because they need to in order to keep something else from breaking and I was not about to find out what.

So instead, I went with the third option and looked into whether disabling the unobtrusive client-side validation would also stop WFFM from inserting the jQuery script as it looked like it was somehow all linked together. I have actually had my pains with the unobtrusive validation in the past so I pretty much knew that it can be disabled by adding an app setting to the web.config.

<add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />

I added the setting and to my amazement, WFFM actually did stop inserting the jQuery reference and instead inserted a script block with the client-side validation directly in the page. Just as normal asp.net would.

Normally by now, I would be thrilled and it did admittedly solve my initial JavaScript conflict. However, I just have to live with the fact that I still have two different versions of jQuery on my pages as WFFM is still loading jQuery v. 1.11.4 and I lost my unobtrusive validation in the process as well.

Have you ever wondered how to maximise the Experience Profile dashboard in Sitecore?

By using Web Forms for Marketers aka WFFM you can use forms on your website to capture data about a visitor and attach it to their profile.  For example, you can use a Contact Us form on the website to capture the name, email, gender, phone number, location, and more. With WFFM you can then add the user to Engagement Plans or EXM email mailing lists.

The scope of this post is how to capture the info from a form. Create your form with fields for the information you want to capture. Having the users name and email would be the bare minimum you would want to capture.

From there you will want to add the following Save Actions to the form, to run when the user clicks submit.

It is important to note that there are three places that information is kept about users; Login account, User Profile, and Contact Details. All three need to be updated with Save Actions.

Select Actions from the dropdown list and click Add; add them in this order:

1) Create User

Creates a user in Sitecore, allowing you to assign a username, password, and domain. I’d recommend using Email as the username (as this is the most unique info you will get), randomly generating the password, and using the extranet domain.

This all gets done under the hood so that user doesn’t even realise they have an account created.

The second tab on this screen is used to edit the User Profile details.

There actually two fields for Name in the User Profile (Full Name and Name). I’d suggest using a single field for the users name and assign this to both.

2)      User Login

This step then actually logs in the user and associates their visitor cookie with this user account.

3)      Update Contact Details

 These are visitor details stored in xDB that you can customise.

 Out of the box you get the following:

-          First name -          Middle name -          Surname -          Title -          Suffix -          Nickname -          Birth date -          Gender -          Job title -          Address details -          Email address -          Email bounce count -          Phone Numbers -          Picture -          Communication Preferences (i.e. Revoked permissions) -          Language -          Social Profile

This is where you can store additional fields from your form into xDB. There are a few guides online on how to do this, this one seems to be the most recent: https://sitecorehacker.com/2016/09/03/creating-custom-sitecore-xdb-contact-facets/

 4)      Send Email Message (Optional)

Its best practice to send an email to the user that you have received their submission.

5)      Logout

Once you’ve associated the login with the Profile there’s no need to keep the user logged in.

 This all looks like this:

Keep in mind that WFFM is being deprecated in Sitecore 8.4 and replaced with the new Sitecore Forms. A new API for working with xDB called xConnect is also coming which should improve the way you can setup custom details about visitors.