Fixed issue country/region field showed Id instead of name when using arrow keys

[joshgk00]

Fixes #3671

Summary

jquery-ui has a default behavior for autocomplete fields where it will use the ui.item.id to update the input field when using the arrow keys to navigate the autocomplete suggestions.

The change that was made was to add an event handler for the focus event so that we could override the default behavior and show the ui.item.name as the user uses the arrow keys to navigate the autocomplete suggestions.

This makes for a better experience so that users know what suggestion they will be selecting as they scroll through the suggestions with the arrow keys.

How to test

• Login to DNN
• Click the Username at the top to view your user profile
• Click Edit Profile
• Expand the Address section
• In the country field, begin typing uni for United States
• You'll see a list of suggestions, use the arrow keys to navigate the list
• The country textbox should now show the country name as you move through the list

Before this fix:

• Begin typing a country name
• When the suggestions popup, use the arrow keys to navigate the list
• You'll notice that the textbox shows a number instead of the country name

After this fix:

• Begin typing a country name
• When the suggestions popup, use the arrow keys to navigate the list
• You'll notice that the textbox shows the country name as you press the keys

[dnfadmin]

All CLA requirements met.

[bdukes]

LGTM

[valadas]

Awesome, thank you very much @joshgk00