UPDATED: This script now works and is a great reference for pulling custom list data with SPServices.
I have a modified script that is working great thanks to the SharePoint Hillbilly . One script is for a title and description for a slider with multiple slides. The other is a footer element that pulls a name and email address from a custom list.
- The script for the slider is being loaded within a content webpart on the homepage.
- The script for the footer is placed and is running in the masterpage
footer exactly where it needs to be generated. - SPServices (jQuery 10+)
- jQuery 10+
Thanks!
SCRIPT 1 FOR SLIDER TEXT AND DESCRIPTION
<script type="text/javascript" src="jquery.SPServices-2013.02a.min.js"></script>
<script type="text/javascript" scr="jquery.min.js"></script>
<script type="text/javascript">
//this is where the script starts after the page is loaded
$(document).ready(function() {
alert("code firing");
GetSliderText();
});
function GetSliderText()
{
//The Web Service method we are calling, to read list items we use 'GetListItems'
var method = "GetListItems";
//The display name of the list we are reading data from
var list = "SliderText";
//You can see here that we are using the internal field names.
var fieldsToRead = "<ViewFields>" +
"<FieldRef Name='slide1title' />" +
"<FieldRef Name='slide1description' />" +
"<FieldRef Name='slide2title' />" +
"<FieldRef Name='slide2description' />" +
"</ViewFields>";
//CAML query
var query = "<Query>" +
"<Where>" +
"<Neq>" +
"<FieldRef Name='ID'/><Value Type='Number'>0</Value>" +
"</Neq>" +
"</Where>" +
"<OrderBy>" +
"<FieldRef Name='Title'/>" +
"</OrderBy>" +
"</Query>";
//Here is our SPServices Call where we pass in the variables that we set above
$().SPServices({
operation: method,
async: false, //if you set this to true, you may get faster performance, but your order may not be accurate.
listName: list,
CAMLViewFields: fieldsToRead,
CAMLQuery: query,
//this basically means "do the following code when the call is complete"
completefunc: function (xData, Status) {
//this code iterates through every row of data returned from the web service call
$(xData.responseXML).SPFilterNode("z:row").each(function() {
//here is where we are reading the field values and putting them in JavaScript variables
//notice that when we read a field value there is an "ows_" in front of the internal field name.
//this is a SharePoint Web Service quirk that you need to keep in mind.
//so to read a field it is ALWAYS $(this).attr("ows_<internal field name>");
//get the field
var slide1title = ($(this).attr("ows_slide1title"));
//get the field
var slide1description = ($(this).attr("ows_slide1description"));
//get the field
var slide2title = ($(this).attr("ows_slide2title"));
//get the field
var slide2description = ($(this).attr("ows_slide2description"));
//call a function to add the data from the row to a div on the screen
AddRowToSlide1(slide1title,slide1description);
AddRowToSlide2(slide2title,slide2description);
});
}
});
}
// This renders the fields.
//
//
function AddRowToSlide1(slide1title,slide1description)
{
$("#slide1").append("<h1>" + slide1title +
"</h1><p>" + slide1description + "</p>");
}
function AddRowToSlide2(slide2title,slide2description)
{
$("#slide2").append("<h1>" + slide2title +
"</h1><p>" + slide2description + "</p>");
}
</script>
<!-- div where our slide data will go -->
<div id="slide1"></div>
<hr />
<div id="slide2"></div>
SCRIPT 2 FOR THE FOOTER AREA THAT PULLS NAME AND EMAIL ADDRESS
<script type="text/javascript" src="jquery.SPServices-2013.02a.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
GetSiteOwner();
});
function GetSiteOwner()
{
//The Web Service method we are calling, to read list items we use 'GetListItems'
var method = "GetListItems";
//The display name of the list we are reading data from
var list = "SiteOwner";
//For whatever list you want to read from, be sure to specify the fields you want returned.
var fieldsToRead = "<ViewFields>" +
"<FieldRef Name='Title' />" +
"<FieldRef Name='Email_x0020_Address' />" +
"</ViewFields>";
//CAML query
var query = "<Query>" +
"<Where>" +
"<Neq>" +
"<FieldRef Name='ID'/><Value Type='Number'>0</Value>" +
"</Neq>" +
"</Where>" +
"<OrderBy>" +
"<FieldRef Name='Title'/>" +
"</OrderBy>" +
"</Query>";
//Here is our SPServices Call where we pass in the variables that we set above
$().SPServices({
operation: method,
async: false, //if you set this to true, you may get faster performance, but your order may not be accurate.
listName: list,
CAMLViewFields: fieldsToRead,
CAMLQuery: query,
//this basically means "do the following code when the call is complete"
completefunc: function (xData, Status) {
//this code iterates through every row of data returned from the web service call
$(xData.responseXML).SPFilterNode("z:row").each(function() {
//here is where we are reading the field values and putting them in JavaScript variables
//notice that when we read a field value there is an "ows_" in front of the internal field name.
//this is a SharePoint Web Service quirk that you need to keep in mind.
//so to read a field it is ALWAYS $(this).attr("ows_<internal field name>");
//get the title field (Site Owner's Name)
var name = ($(this).attr("ows_Title"));
//get the email address field
var emailaddress = ($(this).attr("ows_Email_x0020_Address"));
//call a function to add the data from the row to a table on the screen
AddRowToTable(name,emailaddress);
});
}
});
}
// This renders the site owner title and email address.
//
//
function AddRowToTable(name,emailaddress)
{
$("#siteOwner").append("<p>" + name +
"</p><a href='mailto:" + emailaddress + "'>" + emailaddress + "</a>");
}
</script>
<!-- div where our site owner will go -->
<div id="siteOwner"></div>
