Retrieve Display Name from people picker control in Nintex Forms online

I've used a calculated field to show the Display Name in the people picker. That calculated field calls a javascript function in order to get the Display Name. I've included the people picker control as a passed variable so it will update when the control changes.

The other step you will need to do is to set the people picker control to store the client id in a javascript variable. Name the variable EmployeePicker. You could also use a different name, just make sure to update the javascript code in the fourth row.

function EmployeeDisplayName(EmployeeUser) {
    var str_return = "";
    if(EmployeePicker !== undefined) {
        var ppl = document.getElementById(EmployeePicker);
        var ppl_parent = ppl.parentElement;
        var ppl_div = ppl_parent.getElementsByTagName("div")[0];
        if(ppl_div !== undefined) {
            var ppl_span = ppl_div.getElementsByTagName("span")[0];
            if(ppl_span !== undefined) {
                var ppl_span_div = ppl_span.getElementsByTagName("div")[0];
                if(ppl_span_div !== undefined) {
                    str_return = ppl_span_div.innerHTML;
                }
            }
        }
    }
    return str_return;
}