I need some help with serialization of values from fields from Workflow InfoPath Initialization form.
First thanks to Johndave Decano, which gived me some starting point (form serialize javascript (no framework)).
We have several workflows with InfoPath initiation form.
I need serialize form data and send it to my web service for next processing before the form is submitted.
I am able to get values (value, type, originalid...) from inputs from form, built some XML and send it to web service.
As you can see below, most elements does not have the attribute "name" except with the type = "radio", for which I am able to get the name of the field (my:Kontakt-DodavatelObjednatel) from input name (name = "ctl00_PlaceHolderMain_XmlFormControl, _, my:Kontakt-DodavatelObjednatel, _1_I1_S3_I1_S15_I9 ").
But is it somehow possible to get Name of each fields as it is actually named in the form?
The attribute "originalid" does not match the ID that is in the XSN form template, so I'm not able to combine value with field.
My only one thing is to store index value by input element. But maybe there's a better way ...
<input tabindex="0" title="" class="e9_ka1cdO7PwcuNYulf_0 at_ka1cdO7PwcuNYulf_0" id="ctl00_PlaceHolderMain_XmlFormControl_V1_I1_S3_I1_C12" onfocus="return (CheckBox.OnFocus(this, event));" onblur="return (CheckBox.OnBlur(this, event));" type="checkbox" checked="" viewdatanode="32" originalid="V1_I1_S3_I1_C12" formid="ctl00_PlaceHolderMain_XmlFormControl" scriptclass="CheckBox" direction="ltr" wrapped="true" />
<input name="ctl00_PlaceHolderMain_XmlFormControl,,my:Kontakt-DodavatelObjednatel,,V1_I1_S3_I1_S15_I9" tabindex="0" title="" class="e9_ka1cdO7PwcuNYulf_0 at_ka1cdO7PwcuNYulf_0" id="ctl00_PlaceHolderMain_XmlFormControl_V1_I1_S3_I1_S15_I9_O1" onfocus="return (RadioButton.OnFocus(this, event));" onblur="return (RadioButton.OnBlur(this, event));" type="radio" viewdatanode="37" originalid="V1_I1_S3_I1_S15_I9_O1" formid="ctl00_PlaceHolderMain_XmlFormControl" scriptclass="RadioButton" direction="ltr" wrapped="true" />
Here is my JavaScript function:
function serializeToXml(form)
{
var formIdSet = false;
var formXml = document.implementation.createDocument('', '', null);
var formElement = formXml.createElement('form');
var inputElement = formXml.createElement('input');
var textareaElement = formXml.createElement('textareas');
var selectElement = formXml.createElement('select');
var buttonElement = formXml.createElement('button');
for (i = form.elements.length - 1; i >= 0; i = i - 1)
{
var formElementName = '';
if (!form.elements[i].name)
{
}
else
{
if (!String.isNullOrEmpty(form.elements[i].name))
{
formElementName = form.elements[i].name;
}
}
var formControlType = '';
if (!form.elements[i].getAttribute('scriptclass'))
{
}
else
{
if (!String.isNullOrEmpty(form.elements[i].getAttribute('scriptclass')))
{
formControlType = form.elements[i].getAttribute('scriptclass');
}
}
var parentControlId = '';
var originalId = '';
if (!form.elements[i].getAttribute('originalid'))
{
}
else
{
if (!String.isNullOrEmpty(form.elements[i].getAttribute('originalid')))
{
originalId = form.elements[i].getAttribute('originalid');
if (originalId.indexOf('_') > -1)
{
parentControlId = originalId.substring(0, originalId.lastIndexOf('_'));
}
}
}
var viewDataNode = '';
if (!form.elements[i].getAttribute('viewdatanode'))
{
}
else
{
if (!String.isNullOrEmpty(form.elements[i].getAttribute('viewdatanode')))
{
viewDataNode = form.elements[i].getAttribute('viewdatanode');
}
}
var formId = '';
if (!form.elements[i].getAttribute('formid'))
{
}
else
{
if (!String.isNullOrEmpty(form.elements[i].getAttribute('formid')))
{
formId = form.elements[i].getAttribute('formid');
}
}
if (!String.isNullOrEmpty(formElementName))
{
if (!String.isNullOrEmpty(formId))
{
var regexFormId = new RegExp(formId);
var matchesFormId = regexFormId.test(formElementName);
if (matchesFormId == true)
{
formElementName = formElementName.replace(formId, '');
formElementName = formElementName.replace(/^,_/, '');
formElementName = formElementName.replace(/^,+/, '');
}
}
if (!String.isNullOrEmpty(parentControlId))
{
var regexParentControlId = new RegExp(parentControlId);
var matchesParentControlId = regexParentControlId.test(formElementName);
if (matchesParentControlId == true)
{
formElementName = formElementName.replace(parentControlId, '');
formElementName = formElementName.replace(/_,$/, '');
formElementName = formElementName.replace(/,+$/, '');
}
}
}
var notification = 'Element: \'' + form.elements[i].type + '\'; Object type: \'' + form.elements[i] + '\'; ID: \'' + form.elements[i].id + '\'; Name: \'' + formElementName + '\'; Value: \'' + form.elements[i].value + '\'';
// alert(notification);
switch (form.elements[i].nodeName)
{
case 'INPUT':
switch (form.elements[i].type)
{
case 'text':
var xmlElement = formXml.createElement(form.elements[i].type);
xmlElement.setAttribute('Name', formElementName);
xmlElement.setAttribute('Value', form.elements[i].value);
xmlElement.setAttribute('ControlType', formControlType);
xmlElement.setAttribute('OriginalId', originalId);
xmlElement.setAttribute('ViewDataNode', viewDataNode);
xmlElement.setAttribute('ParentControlId', parentControlId);
// xmlElement.setAttribute('FormId', formId);
inputElement.appendChild(xmlElement);
break;
case 'hidden':
break;
case 'password':
break;
case 'button':
break;
case 'reset':
break;
case 'submit':
var xmlElement = formXml.createElement(form.elements[i].type);
xmlElement.setAttribute('Name', formElementName);
xmlElement.setAttribute('Value', form.elements[i].value);
xmlElement.setAttribute('ControlType', formControlType);
xmlElement.setAttribute('OriginalId', originalId);
xmlElement.setAttribute('ViewDataNode', viewDataNode);
xmlElement.setAttribute('ParentControlId', parentControlId);
// xmlElement.setAttribute('FormId', formId);
inputElement.appendChild(xmlElement);
break;
case 'checkbox':
var xmlElement = formXml.createElement(form.elements[i].type);
xmlElement.setAttribute('Name', formElementName);
var checkboxValue = '';
if (form.elements[i].checked)
{
checkboxValue = 'true';
}
else
{
checkboxValue = 'false';
}
xmlElement.setAttribute('Value', checkboxValue);
xmlElement.setAttribute('ControlType', formControlType);
xmlElement.setAttribute('OriginalId', originalId);
xmlElement.setAttribute('ViewDataNode', viewDataNode);
xmlElement.setAttribute('ParentControlId', parentControlId);
// xmlElement.setAttribute('FormId', formId);
inputElement.appendChild(xmlElement);
break;
case 'radio':
if (form.elements[i].checked)
{
}
var xmlElement = formXml.createElement(form.elements[i].type);
xmlElement.setAttribute('Name', formElementName);
xmlElement.setAttribute('Value', form.elements[i].value);
xmlElement.setAttribute('ControlType', formControlType);
xmlElement.setAttribute('OriginalId', originalId);
xmlElement.setAttribute('ViewDataNode', viewDataNode);
xmlElement.setAttribute('ParentControlId', parentControlId);
// xmlElement.setAttribute('FormId', formId);
inputElement.appendChild(xmlElement);
break;
case 'file':
break;
}
break;
case 'TEXTAREA':
var xmlElement = formXml.createElement(form.elements[i].type);
xmlElement.setAttribute('Name', formElementName);
xmlElement.setAttribute('Value', form.elements[i].value);
xmlElement.setAttribute('ControlType', formControlType);
xmlElement.setAttribute('OriginalId', originalId);
xmlElement.setAttribute('ViewDataNode', viewDataNode);
xmlElement.setAttribute('ParentControlId', parentControlId);
// xmlElement.setAttribute('FormId', formId);
textareaElement.appendChild(xmlElement);
break;
case 'SELECT':
switch (form.elements[i].type)
{
case 'select-one':
var xmlElement = formXml.createElement(form.elements[i].type);
xmlElement.setAttribute('Name', formElementName);
xmlElement.setAttribute('Value', form.elements[i].value);
xmlElement.setAttribute('ControlType', formControlType);
xmlElement.setAttribute('OriginalId', originalId);
xmlElement.setAttribute('ViewDataNode', viewDataNode);
xmlElement.setAttribute('ParentControlId', parentControlId);
// xmlElement.setAttribute('FormId', formId);
selectElement.appendChild(xmlElement);
break;
case 'select-multiple':
for (j = form.elements[i].options.length - 1; j >= 0; j = j - 1)
{
if (form.elements[i].options[j].selected)
{
var xmlElement = formXml.createElement(form.elements[i].type);
xmlElement.setAttribute('Name', formElementName);
xmlElement.setAttribute('Value', form.elements[i].value);
xmlElement.setAttribute('ControlType', formControlType);
xmlElement.setAttribute('OriginalId', originalId);
xmlElement.setAttribute('ViewDataNode', viewDataNode);
xmlElement.setAttribute('ParentControlId', parentControlId);
// xmlElement.setAttribute('FormId', formId);
selectElement.appendChild(xmlElement);
}
}
break;
}
break;
case 'BUTTON':
switch (form.elements[i].type)
{
case 'reset':
break;
case 'submit':
break;
case 'button':
var xmlElement = formXml.createElement(form.elements[i].type);
xmlElement.setAttribute('Name', formElementName);
xmlElement.setAttribute('Value', encodeURIComponent(form.elements[i].value));
xmlElement.setAttribute('ControlType', formControlType);
xmlElement.setAttribute('OriginalId', originalId);
xmlElement.setAttribute('ViewDataNode', viewDataNode);
xmlElement.setAttribute('ParentControlId', parentControlId);
// xmlElement.setAttribute('FormId', formId);
buttonElement.appendChild(xmlElement);
break;
}
break;
}
}
formElement.appendChild(inputElement);
formElement.appendChild(textareaElement);
formElement.appendChild(selectElement);
formElement.appendChild(buttonElement);
formXml.appendChild(formElement);
var outerXml = (new XMLSerializer()).serializeToString(formXml);
var xmlEncodedOuterXml = escapeXml(outerXml);
return xmlEncodedOuterXml;
}
String.isNullOrEmpty = function (value) {
return !(typeof value === 'string' && value.length > 0);
}
// XML Escaping
function escapeXml(xmlString) {
return xmlString.replace(/[<>&'"]/g, function (c) {
switch (c) {
case '<':
return '&lt;';
case '>':
return '&gt;';
case '&':
return '&amp;';
case '\'':
return '&apos;';
case '"':
return '&quot;';
}
});
}
