detecting a unpublish page in Pages list

Question

Hello everybody,

I have a normal publishing site with a Pages list containing many pages. There is no workflow at all. I want to change the icon of pages for those pages (items) that has been checked in but not published (draft). How can I achive it? every kind of solution is appreciated but we want to find a client side object model solution (JavaScript). Thank you very much.

Answer 1

you can either use XSLT or JSLink to modify the OOTB behavior , you can reuse what is done for checkout and change the condition 

below is how OOTB checkout is done

   <xsl:when test="not ($thisNode/@CheckoutUser.id) or $thisNode/@CheckoutUser.id =''">
                            <img border="0" alt="{$thisNode/@FileLeafRef}" title="{$thisNode/@FileLeafRef}" src="/_layouts/15/images/{$thisNode/@HTML_x0020_File_x0020_Type.File_x0020_Type.mapico}?rev=23"/>
                        </xsl:when>
                        <xsl:otherwise>
                            <xsl:variable name="alttext"><xsl:value-of select="$thisNode/@FileLeafRef"/><xsl:text disable-output-escaping="yes" ddwrt:nbsp-preserve="yes">&#10;</xsl:text><xsl:value-of select="$thisNode/../@managecheckedoutfiles_header_checkedoutby"/>: <xsl:value-of select="$thisNode/@CheckoutUser.title"/></xsl:variable>
                            <img border="0" alt="{$alttext}" title="{$alttext}" src="/_layouts/15/images/{$thisNode/@HTML_x0020_File_x0020_Type.File_x0020_Type.mapico}?rev=23" />
                            <img src="/_layouts/15/images/checkoutoverlay.gif?rev=23" class="ms-vb-icon-overlay" alt="{$alttext}" title="{$alttext}" />                            
                        </xsl:otherwise>

and this is the Javascript version

  if (typeof listItem["CheckoutUser"] == 'undefined' || listItem["CheckoutUser"] == '') {
                            ret.push('<img width=\"16\" height=\"16\" border="0" alt="');
                            ret.push(listItem.FileLeafRef);
                            ;
                            ret.push('" title="');
                            ret.push(listItem.FileLeafRef);
                            ;
                            ret.push('" src="' + '/_layouts/15/images/');
                            ret.push(listItem["HTML_x0020_File_x0020_Type.File_x0020_Type.mapico"]);
                            ret.push('"');
                            if (Boolean(listItem["HTML_x0020_File_x0020_Type.File_x0020_Type.isIconDynamic"])) {
                                ret.push(' onclick="this.style.display=\'none\';"');
                            }
                            ret.push('/>');
                        }
                        else {
                            ret.push('<img width="16" height="16" border="0" alt="');
                            var alttext = listItem.FileLeafRef + "&#10;" + Strings.STS.L_SPCheckedoutto + ": " + (Boolean(listItem["CheckoutUser"]) ? STSHtmlEncode(listItem["CheckoutUser"][0].title) : '');

                            ret.push(alttext);
                            ret.push('" title="');
                            ret.push(alttext);
                            ret.push('" src="' + '/_layouts/15/images/');
                            ret.push(listItem["HTML_x0020_File_x0020_Type.File_x0020_Type.mapico"]);
                            ret.push('" /><img src="' + '/_layouts/15/images/checkoutoverlay.gif' + '" class="ms-vb-icon-overlay" alt="');
                            ret.push(alttext);
                            ret.push('" title="');
                            ret.push(alttext);
                            ret.push('" />');
                        }
                    }

and below link how to update the display links

http://www.martinhatch.com/2013/08/jslink-and-display-templates-part-5-creating-custom-list-views.html

---

Hope that helps|Amr Fouad|MCTS,MCPD sharePoint 2010

Answer 2

thank you