Payment widget- full name not normalizing all characters in a composite

Liberty Create
1

Hi,

We’ve recently found out our payment widget isn’t normalizing accented characters in customers last names and so at the end of the form the widget doesn’t load the capita interface.

We’ve got a composite that combines - title, first name and last name fields and a rule that then passes those (when any value in those fields changed) to another field called ‘full name’. This is then used as the reference in our widget for bringing the full name over into capita.

I’ve noticed whilst investigating the issue that the code we’ve got in currently works to normalize an accented character in the first name field but not for the last name for some reason (even though they’re not different settings wise in the composite).
let card_holder_name_trim = card_holder_name.normalize(‘NFD’).replace(/[\u0300-\u036f]/g, ‘’);
card_holder_name_trim = card_holder_name_trim.substring(0,50);

(Above works for the singular field o ‘address line 1’ and it’s also working for separate fields in our personalization’s for gov.uk notify emails so I’m guessing it’s something up with fields being in the composite but I’m not sure what to try next…)

I’ve tried adding in a conversion function step into the rule that copy’s the field values from the composite to the full name field used in the widget but again that’s not having any affect on the last name accented characters.
(field processor)
return params.input ? params.input.normalize(‘NFD’).replace(/[\u0300-\u036f]/g, ‘’): params.input;

We’ve also tried another solution for encoding the string but although this works it doesn’t replace the characters nicely and it’s turning spaces in composite to 20%.
let card_holder_name_trim = encodeURIComponent(card_holder_name).substring(0, 50);

Just wondering if anyone has come across this before and if so how did they manage to resolve? - Or do others use something else for normalising characters?

Thanks and kind regards,
Erin

2

Hi Erin,

I replicated this in my environment and had no issues, so it looks like your code is working.

To ensure you are getting the correct values into your payment widget pass the field to the widget via field path.

return {
			full_name_field: {
				main_label: "Full name field",
				base_format: "field_path"
			}
		};

Collect the value via the widget’s base object.

const baseObject = cs.record(widget.get_base_record_id());
const fullNameField = widget.get_setting("full_name_field");
const fullName = baseObject.get(fullNameField, "displayable");

Normalise

function normaliseString(string) {
	return string.normalize("NFD").replace(/[\u0300-\u036f]/g, "").substring(0, 50);
}

const normalisedFullName = normaliseString(fullName);

This works for me. Let me know if this helps/if you have any further questions.

Dan :slight_smile:

1 Like
3

Thanks Dan,

I had another look with a colleague and he pointed out that we were also referencing the customers last name in the payment narrative field so that aspect of code also needed the normalizing code adding to it. That’s fixed the issue we were having. :slightly_smiling_face:

1 Like