I am in the process of redesigning my site set up to make it completely automated. Currently, we have a little script editor that shows some links like such:
The code for the script editor looks like this:
<table border="0">
<tr>
<td>
<a href="https://contoso.sharepoint.com/sites/subsite/SitePages/Project%20Dashboard.aspx?ProjectName=CS1">
<img src="https://contoso.sharepoint.com/sites/subsite/Project%20Pictures/cs1.png" height="78" /></a>
</td>
</tr>
</table>
Basically I want to replace this script editor with some custom code. I think a content editor running a script would work well, but I am not sure how exactly to query the objects.
Basic gist of how it should work: Query the list of projects, looking in the "active" (yes/no) column. If the project is active, go to the ProjectPicture column and copy the URL of the picture, as well as the parameter for said project. The parameter for the site is ProjectCode.
For example, let's say Project1 is active. Then we should pull the picture url (URL points to a picture library) for project1. Also, save the parameter "PROJ1". Then, create a picture that when clicked on goes to ProjectDashboard.aspx?ProjectCode=PROJ1.
This process should put up a picture for each of the projects that are active in the project profile.
I assume we can use javascript/jquery to accomplish this, however I am just getting start with the JSOM.
Edit: I have been playing with using the JSOM to query the project profile:
I am trying to pull in the records where the Active field = yes, and then just alert the number of elements found as well as the data I want in them. However, the alert box isn't popping up, telling me the onQuerySucceeded isn't doing what it is supposed to. Below is the code I am trying to use, and I have been testing it in a script editor. As far as the CAML query goes, I have tried using Bool, Boolean, Text, and Integer to try and get it to work with no avail.
<html>
<head>
<script type="text/javascript">
ExecuteOrDelayUntilScriptLoaded(retrieveListItems, "sp.js");
function retrieveListItems() {
var numElements = 0; //number of elements found in CAML query
var clientContext = new SP.ClientContext(); //create client context at this site collection.
var oList = clientContext.get_web().get_lists().getByTitle('ProjectProfile'); //create list object by the title of the, projectParameters is the list to look through
var camlQuery = new SP.CamlQuery(); //create CAMLquery to pull in list items.
camlQuery.set_viewXml('<View><Query><Where><Eq><FieldRef Name="Active"/>' +
'<Value Type="Boolean">' + 1 + '</Value></Eq></Where></Query></View>'); //define the query, here we pull in the records where the project is active
this.collListitem = oList.getItems(camlQuery);//get the items from the list object based on the query defined above.
clientContext.load(collListitem);//telling the object model to prepare to execute the following object by loading it into the client context.
clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
}
function onQuerySucceeded(sender, args) {
var listItemInfo1 = '';
var listItemInfo2 = '';
var listItemEnumerator = collListitem.getEnumerator();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
listItemInfo1 += oListItem.get_item('ProjectName');
listItemInfo2 += oListItem.get_item('ProjectPicture');
numElements++;
};
alert(numElements);
alert(listItemInfo1);
alert(listItemInfo2);
}
function onQueryFailed(sender, args) {
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
</script>
</head>
<body>
</body>
