Displaying 'people/group' field from list - remove id's and #

Dec 15, 2011 at 5:01 PM

Hi,

I am using SPServices to retrieve values from a list, several of these fields are people / group picker fields. This means that when the value is returned I get the ID of the person returned as well as the # symbol. Is there an easy function to remove this and just display the names in this format : Name, Name , Name?

Even better - is it at all possible to display these in the same way that sharepoint highlights user fields?

Many Thanks,

Michael

Dec 15, 2011 at 5:35 PM
Edited Dec 15, 2011 at 7:44 PM

I just answered a question very similar to this here.

What I do with people fields is use the split() function to get the two elements into an array. Then you're free to use them apart from each other by specifying an index. For instance, if you wanted to print out who the creator of the item is you would do something like:

 

$("#authorContainer").html($(this).attr("ows_Author").split(";#")[1]);

 

I'm not sure what you mean by "in the same way that sharepoint highlights user fields", but if you mean making it a link to the user's profile page, you would do something like this:

 

var author = $(this).attr("ows_Author").split(";#");

$("#authorContainer").html("<a href='" + $().SPServices.SPGetCurrentSite()
+ "/_layouts/userdisp.aspx?ID=" + author[0] +"'>" + author[1] + "</a>");
Dec 15, 2011 at 7:39 PM

I use .split() as well... One thing to note: You have to test whether or not the value is defined prior to running the .split() method.  It doesn't matter for @Author, since that's never undefined, but in some other cases, you'll definitely want to do that.  Here's some sample code:

var $node = $(this),
    requestType = ( $node.attr("ows_Request_x0020_Type") ) ? 
	$.trim( $node.attr("ows_Request_x0020_Type").split(";#")[1] ) : 
	"None";

It'd be best to abstract this and make a function out of it as well, so your codebase is tight and compact.

Cheers,

Matt

Dec 15, 2011 at 8:48 PM

Thank you both....

I have come up with the code below, I would appreciate feedback on my code and how I could improve it as I am not the best JS coder :)

function formatuser(variable){
   // check if var is blank before split
   if(variable == undefined){
   output = "Not entered";
   }else{
   var array = variable.split(";#");
   var output = "";
   var i = 0;
   var id="";
   var name="";

	for (var i=0;i<array.length;i++)
	{
	id = array[i];
	name = array[i+1];
	output += "<p><a href='/sites/pyramid/_layouts/userdisp.aspx?ID=" + id + "'>" + name + "</a></p>";
	i++;
	}   
	}
	   
   return output;
   };

Dec 15, 2011 at 8:49 PM

The main thing about my issue is that sometimes I had multiple users and I wanted these formatted correctly.

Dec 15, 2011 at 9:52 PM

That looks good, Michael. You wouldn't have any problem running the code just like that, but I'll point out a couple things I see that can be optimized.

In javascript, you can just run the variable itself through an if statement to see if it's undefined or not. So instead of "variable == undefined" you can just write "!variable". The exclamation point means opposite of. One of the things I love about javascript is being able to use so many different types as a boolean value.

Next, since you are only using the "id" and "name" variables once, you could get rid of them all together and just use the "array[i]" and "array[i+1]" inline. You don't need to declare the i = 0 up at the top either, because you're declaring it in the first parameter of the for loop. Also, instead of having the i++ twice, you can change the incrementer in the for loop to jump 2 after every loop.

Here's the code with those few things implemented:

function formatuser(variable){
    // check if var is blank before split
    if(!variable) output = "Not entered";
    else{
        var array = variable.split(";#");
        var output = "";

        for (var i=0;i<array.length;i=i+2){
output += "<p><a href='/sites/pyramid/_layouts/userdisp.aspx?ID=" + array[i] + "'>" + array[i+1] + "</a></p>";
}
} return output; }

Dec 15, 2011 at 11:21 PM

Thank you very much for your initial suggestions and also your code improvements :) really helps!!