Developing complex and dynamic forms solution easily in SharePoint using Nintex Forms

Provide intuitive validation on the click of ‘Submit’ button :

Nintex forms by default provide validation rules for validation where in we can specify Boolean
conditions using Named controls, Nintex forms runtime functions, custom JavaScript validation etc.
Whenever the form is saved or submitted, these validation rules are fired and a validation summary
containing a bulleted list of all errors is shown at the top of the form.

However, this is not a good experience for the users as the users who are already at the bottom of the
form while submitting it cannot see the errors at the top which results in confusion. In order to address
this , we can show the default validation summary generated by Nintex forms in a jquery modal dialog
box in the middle of the form. To create this jquery modal dialog, the following JavaScript needs to be
added to the custom JavaScript section of the form:
function WebForm_OnSubmit()
{
if (typeof (ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) {
NWF$('.nf-validation-summary').dialog({
title: "Validation Error!",
modal: true,
resizable: false,
width: 600,
height: 400,
buttons: {
Close: function () {
NWF$(this).dialog('close');
}
}
});
return false;
}
NWF$('#'+ddlOnboardingTabs).find('label').eq(0).click();
NWF$('#'+ddlOnboardingTabsBottom).find('label').eq(0).click();
HCLT Confidential Page 34 of 39
if(submitButtonClicked=='Submit')
{
alert('Form submitted successfully!!');
}
return true;
}

Comments