Get Name from People Picker

Discussions about Forms Designer for SharePoint 2013 / 2016 and Office 365.
Locked
User avatar
TonyDuke
Posts: 71
Joined: Mon Sep 11, 2017

27 Nov 2017

Good Morning,

I am trying to get the Value of a Client People Picker Field (Single), specifically the name, I have tried the following: -

Code: Select all

fd.field('Call_x0020_Taken_x0020_By').control('ready', function() {
  var selectedUsers = fd.field('Call_x0020_Taken_x0020_By').value();
  for (var i = 0; i < selectedUsers.length; i++) {
    alert(selectedUsers[i].Key);
  }
});
This returns an alert with the message - i:0#.f|membership|tony.duke@*****.com, what I want it to return is just Tony Duke, how do I amend the code to achieve this?

Thanks

User avatar
Nikita Kurguzov
Posts: 889
Joined: Mon Jul 03, 2017

27 Nov 2017

Hello, Tony!
Try this:

Code: Select all

fd.field('Call_x0020_Taken_x0020_By').control('ready', function() {
  alert(fd.field('Call_x0020_Taken_x0020_By').value()[0].DisplayText);
});
Cheers

User avatar
TonyDuke
Posts: 71
Joined: Mon Sep 11, 2017

27 Nov 2017

Hi Nikita,

Thanks for the reply, I think we're getting there, if I run the command in the console, it returns the correct value, however when entered into the Javascript editor to run on load it returns the same as before, my code now is as follows: -

Code: Select all


setCallTakerDisplay();

// Sets the Call Taker Display Field
function setCallTakerDisplay () {
	fd.field('Call_x0020_Taken_x0020_By').control('ready', function() {
	var callTaker = fd.field('Call_x0020_Taken_x0020_By').value()[0].DisplayText;
	var dateLogged = fd.field('Time_x0020_Logged').value()[0];
	var hourLogged = fd.field('Time_x0020_Logged').value()[1];
	var minLogged = fd.field('Time_x0020_Logged').value()[2];
	$("#callTakerDetails").html('<p style="font-size:14px; color:#4F81BD;"><b>Call Taken by - </b>' + callTaker + ' on ' + dateLogged + ' at ' + hourLogged +  minLogged +'</p>');
	});
}
The result of the above on form load is: -
Call Taken by - i:0#.f|membership|tony.duke@*****.com on undefined at undefinedundefined

As per the other forum thread viewtopic.php?f=1&t=1273, you will see that this code also returns the Date and Time as undefined, after a bit of investigation I have found that this is because the Field Template is set to Kendo DateTime Picker, we do however need to utilise this as we have the time picker interval set at 1 minute, how should this code be changed to work with the Kendo Template?

Thanks

User avatar
Nikita Kurguzov
Posts: 889
Joined: Mon Jul 03, 2017

27 Nov 2017

For Kendo, try this instead:

Code: Select all

setCallTakerDisplay();

function setCallTakerDisplay () {
    fd.field('Call_x0020_Taken_x0020_By').control('ready', function() {
        var date = fd.field('DateTime').value()
        var dd = date.getDate();
        var mm = date.getMonth()+1; //January is 0!
        var yyyy = date.getFullYear();

        if(dd<10) {
            dd = '0'+dd
        } 

        if(mm<10) {
            mm = '0'+mm
        } 

        dateLogged = mm + '/' + dd + '/' + yyyy;
        hourLogged = fd.field('DateTime').value().getHours();
        minLogged = fd.field('DateTime').value().getMinutes();
        $("#callTakerDetails").html('<p style="font-size:14px; color:#4F81BD;"><b>Call Taken by - </b>' + callTaker + ' on ' + dateLogged + ' at ' + hourLogged + ":" + minLogged +'</p>');
    });
}
Cheers

User avatar
TonyDuke
Posts: 71
Joined: Mon Sep 11, 2017

27 Nov 2017

Hi Nikita,

The time date is now working 100% thanks for that, so just the issue with the people picker field, any ideas on that one?

Thanks

User avatar
Nikita Kurguzov
Posts: 889
Joined: Mon Jul 03, 2017

27 Nov 2017

Try either this code with small delay, it should work well:

Code: Select all

setTimeout(function() {
  setCallTakerDisplay();
}, 1000);

function setCallTakerDisplay () {
	var callTaker = fd.field('Call_x0020_Taken_x0020_By').value()[0].DisplayText;
	var date = fd.field('DateTime').value()
	var dd = date.getDate();
	var mm = date.getMonth()+1; //January is 0!
	var yyyy = date.getFullYear();

	if(dd<10) {
    	dd = '0'+dd
	} 

	if(mm<10) {
    	mm = '0'+mm
	} 

	dateLogged = mm + '/' + dd + '/' + yyyy;
	hourLogged = fd.field('DateTime').value().getHours();
	minLogged = fd.field('DateTime').value().getMinutes();
	$("#callTakerDetails").html('<p style="font-size:14px; color:#4F81BD;"><b>Call Taken by - </b>'
	 + callTaker + ' on ' + dateLogged + ' at ' + hourLogged + ":" + minLogged +'</p>');
}
Cheers

User avatar
TonyDuke
Posts: 71
Joined: Mon Sep 11, 2017

27 Nov 2017

Hi Nikita,

Had to set the delay to 1500 for it to work consistently, but it is barely noticeable so should do the job well.

Thanks again.

User avatar
Nikita Kurguzov
Posts: 889
Joined: Mon Jul 03, 2017

27 Nov 2017

Great! Whatever works for you, keep it. Just to be extra sure, you can increase delay even a bit longer as Forms usually take awhile to load, and the script might take some time to execute on slower machines, but in general, you should be good.
Cheers

Locked
  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest