Tags

, , ,

Customizing a SharePoint site (customizing means develop from scratch some pages with SharePoint Designer, of course based on a custom master page, and show and submit data from these pages), I was required to show version history for items in a custom list. Without server side, I had not fast way to do this. However, even if is not a nice solution, you can always read and parse “Versions.aspx” built-in application page. Let’s assume you already know list item and list id.

var listId = '{52CD7375-1125-4166-9741-DF8BFC0A2648}';
var listItemId = '140';

Create an empty table tag in your custom page and assign and ID.

<table id="versions"></table>

With some help from jQuery, is now the time to make an Ajax request to Versions.aspx, parse the response and populate our table with data.

jQuery.ajax({
    url: 'siteurl/_layouts/15/Versions.aspx?list=' + listId + '&Id=' + listItemId,
    cache: false,
    data: 'html',
    success: function (data) {
        var html = jQuery(data).find('.ms-settingsframe').html();
        jQuery('#versions').html(html);
    }
});

This code is doing the job. But there is only one thing left. You might be require to remove as much as possible direct access to the back-end, so a normal step is to remove “href” attributes for links and “onclick” events. In this case, you need to re-rewrite a little bit the Ajax request:

jQuery.ajax({
    url: 'siteurl/_layouts/15/Versions.aspx?list=' + listId + '&Id=' + listItemId,
    cache: false,
    data: 'html',
    success: function (data) {
        var html = jQuery(data).find('.ms-settingsframe').html();
        var noHref = /(href="([^>]+)")/ig;
        var noClicks = /(onclick="([^>]+)")/ig;
        html = html.replace(noHref, '').replace(noClicks, '');
        jQuery('#versions').html(html);
    }
});

As I told you, this is far away from being an elegant solution. But in some case it might be sufficient and you can start continue working on other tasks.

Advertisements