Thursday, October 29, 2015

Replace Text with Images in SharePoint List View using jQuery

“Project status” column is a lookup column and can contain the following values:
  • Good
  • Attention
  • Critical
I decided to use jQuery to do this. This is what I’ve come up with:
$('table[summary="Projects "] tbody tr td:nth-child(5)').each(function () {
if ($(this).find(">:first-child").text() == "Attention") {
$(this).html('<img alt="" src="/Images1/Cloud.png" width="24px" height="24px" />');
$(this).css("text-align", "center");
}
});

$('table[summary="Projects "] tbody tr td:nth-child(5)').each(function () {
if ($(this).find(">:first-child").text() == "Good") {
$(this).html('<img alt="" src="/Images1/Cloud-Sun.png" width="24px" height="24px" />');
$(this).css("text-align", "center");
}
});

$('table[summary="Projects "] tbody tr td:nth-child(5)').each(function () {
if ($(this).find(">:first-child").text() == "Critical") {
$(this).html('<img alt="" src="/Images1/Cloud-Thunder.png" width="24px" height="24px" />');
$(this).css("text-align", "center");
}
});

Ref Link : http://www.sharepointusecases.com/2014/04/replacing-strings-icons-list-view-jquery-sharepoint-2010/

No comments:

Post a Comment