1

Sorry if this is stupid easy but I'm trying to display user pictures from sharepoint in datatables. I can see the link in JSON data coming back from the ajax query in the "Picture" field so I added:

"aoColumnDefs": [
{"aTargets": [0], "mData": "Picture", "sClass": "center","mRender": function ( data, type, full ) {
                    return '<img src="'+data+'"></>';
                  } 
},

I get a "broken picture" type black box with an X in it. I'm noticing that I'm getting 2 urls back in that field though so I will try to use substring in the query to clean that up. I'm also wondering if datatables would by default size the rows to fit the pictures, or resize the pictures to fit in the existing row size, or if the pictures not fitting into the row size is what's making them not display.

UPDATE: Thanks to PirateEric I've figured out a way to make this work and add a default picture:

{"aTargets": [0], "mData": "Picture", "sClass": "center","mRender": function ( data, type, full ) {
                    if(data == null) {
                    return '<img src="https://linkToADefaultImage.png"></>';
                    } else {
                    return '<img src="'+data.split(",")[0]+'"></>';
                    }
            }

},

Improve this question
4
  • Images with Xs mean broken links, resolve that first and see what the result is
    – Eric Alexander
    Commented Jul 25, 2014 at 18:11
  • Yeah, agreed, I'm looking into how to either get a substring up to "," or better yet find out why sharepoint is giving me two URLs in the first place which if there's no good reason for it then I'll kill it there. I thought it might be an incorrect AA mapping but I only see the one for SSL. The "Picture" URL I'm getting back in JSON has the correct url first and then a comma and then a second URL that specifies port 443 which makes no sense really because it's already using https anyway. The JSON looks like this:https://server/..../useranme.jpg,https://server:443/..../username.jpg
    – Matt Nelson
    Commented Jul 26, 2014 at 0:42
  • Then you should just be able to split it into an array and get the zero index url, like var imgUrl = $(image).split(",")[0] where image is the json string
    – Eric Alexander
    Commented Jul 26, 2014 at 4:08
  • Thank you PirateEric! Yes, that was easier than trying to figure out why sharepoint is doing that. I just had to wrap the whole thing into an "if" and return a link to a default image for users who have no image (otherwise the javascript fails on trying to split null).
    – Matt Nelson
    Commented Aug 7, 2014 at 18:56

1 Answer 1

Reset to default
1

Based on the data you are getting back from the call, you'd want to return something like data.split(",")[0].

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.