Getting around the Server Object Model for displaying data from multiple site collections in a site in the SharePoint Online environment... JQuery comes to the rescue...
We had a typical challenge to fetch the site collections data across multiple farms in a web part. A sandbox solution was certainly not the answer since it cannot access beyond the scope of the immediate site collection.
JQuery comes to our rescue here, I learned some amazing functionality that I would like to share....
In the below code we are trying to get the list of Site collections which have a list deployed with metadata mapped fields.
We are displaying the results in a JQuery Datatable
We had a typical challenge to fetch the site collections data across multiple farms in a web part. A sandbox solution was certainly not the answer since it cannot access beyond the scope of the immediate site collection.
JQuery comes to our rescue here, I learned some amazing functionality that I would like to share....
In the below code we are trying to get the list of Site collections which have a list deployed with metadata mapped fields.
We are displaying the results in a JQuery Datatable
2. Get the Jquery references libraries from here http://jquery.com/
Steps :- Deploy a custom list in each of the site collections which need to be discovered - this list has the fields which will need to be mapped in central admin once the crawl has run.
- Create mapped search meta data properties and via JQuery fetch the code. I am using only one custom property in the code below. Learn how to map properties http://technet.microsoft.com/en-us/library/cc262933(office.12).aspx
- Write your JQuery code ( below is an example to get all site collections, this can be conditionally done as well, based on a look up column of Choice Type.
- Upload the css and JQuery Files in the right path and map it correctly in the html file
- Uncomment the alerts so that you can get the values for debugging purposes.
- This html file can now be uploaded to the documents library and be linked from any content editor web part and we have what we need!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:mso="urn:schemas-microsoft-com:office:office" xmlns:msdt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882" >
<head>
<title>My New Page</title>
<style type="text/css" title="currentStyle">
@import "/Style Library/assets/css/demo_page.css";
@import "/Style Library/assets/css/demo_table.css";
</style>
<script type="text/javascript" language="javascript" src="/Style%20Library/assets/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="/Style%20Library/assets/js/jquery.dataTables.min.js"></script>
<script language="javascript" src="/Style%20Library/assets/js/jquery.SPServices-0.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
var resultStatus;
$(document).ready(function () {
SearchForProperty ();
$('#example').dataTable({ "aaSorting": [[4, "desc"]] });
ShowHideTableColumn(5);});
function ShowHideTableColumn( iCol )
{
/* Get the DataTables object again - this is not a recreation, just a get of the object */
var oTable = $('#example').dataTable();
var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
oTable.fnSetColumnVis( iCol, false );
}
var queryText ='<QueryPacket xmlns="urn:Microsoft.Search.Query" Revision="1000">'
queryText += '<Query domain="QDomain">'
queryText += '<SupportedFormats>'
queryText += '<Format>'
queryText += 'urn:Microsoft.Search.Response.Document.Document'
queryText += '</Format>'
queryText += '</SupportedFormats>'
queryText += '<Range>'
queryText += '<Count>20</Count>'
queryText += '</Range>'
queryText += '<Context>'
queryText += '<QueryText language="en-US" type="STRING">'
queryText += '</QueryText>'
queryText += '</Context>'
queryText += '<Properties>'
queryText += '<Property name="Title"/>'
queryText += '<Property name="Path"/>'
queryText += '<Property name="Description"/>'
queryText += '<Property name="Write"/>'
queryText += '<Property name="Rank"/>'
queryText += '<Property name="Size"/>'
queryText += '<Property name="YOURCUSTOMMETADATAPROPERTY"/>'
queryText += '</Properties>'
queryText += '</Query>'
queryText += '</QueryPacket>';
var SearchForProperty = function () {
var results = $('#result');
$().SPServices({
operation: 'Query',
queryXml: queryText,
completefunc: function (xData, Status) {
$(xData.responseXML).find('QueryResult').each(function () {
//let's see what the response looks like
var x = $('<xml>' + $(this).text() + '</xml>');
// alert($(this).text());
x.find('Document').each(function () {
var Metadataproperty= '';
$(this).find('Property').each(function () {
propname = $('Name', $(this)).text();
if (propname == ‘YOURCUSTOMMETADATAPROPERTY’) {
Metadataproperty = $('Value', $(this)).text();
//alert('My custom metadata property =' + Metadataproperty);
}
});
$('#example').dataTable().fnAddData([Metadataproperty]);
$('#loading').hide();
});
});
}
});
}
</script>
</head>
<body>
<div id="demo">
<p style='text-align:right'>View the results </p>
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
thead>
<tr >
<th style='text-align:left'>Metadata property : values</th>
</tr>
</thead>
</div>
</body>
</html>
