locked
detecting a unpublish page in Pages list RRS feed

  • 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.

    Friday, November 8, 2013 9:23 PM

Answers

  • 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

    • Marked as answer by Medes71 Saturday, November 9, 2013 7:30 AM
    Friday, November 8, 2013 10:54 PM

All replies

  • 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

    • Marked as answer by Medes71 Saturday, November 9, 2013 7:30 AM
    Friday, November 8, 2013 10:54 PM
  • thank you
    Saturday, November 9, 2013 7:32 AM