Quantcast
Viewing all articles
Browse latest Browse all 6517

New Post: Programmatically show a list

You can create the list on page load, then in the completefunc, call a short script that performs a GetListItems operation and enumerates them to build your HTML on the fly, displayed in a <div> element placeholder in an existing CEWP. You won't have all the whiz-bang features of a typical list view but you can at least link your items to their DispForm.aspx (detail) view. Of course, all this is dependent on building/populating your list completely before the manual rendering step occurs.

For instance, I don't like that the basic "Links" list format in SharePoint doesn't allow you to specify a new window (target="_blank") and I have a links list I show in a web part on my home page. So, I modified the list to inlcude a new field, "New Window", as a boolean. In order to display the list on the home page with the new window functionality operational, I render it myself in a CEWP with a div element (CustomLinksDiv) on page load (of course, the data already exists at this point).
function PrepareLinks() {
    //Update Advanced Links web part
    var strHTML = "<table class='ms-summarycustombody' id='acqsvs_Links' style='margin-bottom:5px;' border='0' cellSpacing='0' cellPadding='0' summary='Links'>";
    var strLinkURL;
    var strLinkLabel;
    $().SPServices({
        operation: "GetListItems",
        async: false,
        listName: "Links",
        CAMLViewFields: "<ViewFields Properties='True' />",
        completefunc: function(xData, Status) {
            $(xData.responseXML).SPFilterNode("z:row").each(function(){
                strHTML += "<tr><td class='ms-vb' style='padding-top:3px; padding-bottom:5px; vertical-align:middle'><img src='/_layouts/images/square.gif' complete='complete'/>"
                        + "<td class='ms-vb' style='padding-bottom:5px; padding-left:5px; vertical-align:middle; font-family:tahoma,sans-serif'><a href='";
                strLinkURL = $(this).attr("ows_URL");
                strLinkURL = strLinkURL.slice(0, strLinkURL.indexOf(","));
                strLinkLabel = $(this).attr("ows_URL");
                strLinkLabel = strLinkLabel.slice(strLinkLabel.indexOf(",") + 2, strLinkLabel.length);
                strHTML += strLinkURL + "'";
                if($(this).attr("ows_Comments")) {
                    strHTML += " title='" + $(this).attr("ows_Comments") + "'";
                }
                if($(this).attr("ows_NewWindow") == true) {
                    strHTML += " target='_blank'";
                }
                else {
                    strHTML += " target='_self'";
                }
                strHTML += ">" + strLinkLabel + "</a></td></tr>";
            });
        }
    });
    strHTML += "</table>";
    $("#CustomLinksDiv").html(strHTML);
}
The result is a links list on my home page that users can't tell from a regular web part....except that links that are supposed to open in a new window do so.

This works for me because I have a relatively short list to render. Obviously, this amount of client side HTML generation could seriously delay your page load on a large list.

GKO

Viewing all articles
Browse latest Browse all 6517

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>