Step 1: Kindly follow my intital post to understand how java script can be used in Content Editor Web Part.
Step 2: Refer here to understand about SPServices. This is specialized Jquery to execute SharePoint related operations.
Step 3: Refer here to understand more about SPServices.GetListItems.
Step 5: Create a custom List and populate with records.
Step 6: Write the following code in a text. save as html. upload into SharePoint Document Library. Link this html page to content editor web part or Write code in Web Part's text editor directly.
<html>
<head>
<SCRIPT type=text/javascript src="http://MySPSite.com/sites/test/DocLib/jquery-1.4.2.min.js"></SCRIPT>
<SCRIPT type=text/javascript src="http://MySPSite.com/sites/test/DocLib/jquery.SPServices-0.7.2.min.js"></SCRIPT>
<title>Contents from MycustomList</title>
</head>
<body>
<table id="myDataTable" border =1 width="95%" align="center">
<tr align='left' bgcolor="lightBlue">
<td><B>ID</B></td>
<td><B>Department</B></td>
<td><B>Project</B></td>
<td><B>To Do</B></td>
<td><B>End Date</B></td>
</tr>
</table>
<SCRIPT type=text/javascript>
get() ;
function get()
{
var method = "GetListItems";
var webURL = $().SPServices.SPGetCurrentSite() ;
var list = "MyCustomList";
var fieldsToRead = "<ViewFields>"+"<FieldRef Name='Name' />" +"</ViewFields>";
var query = "<Query><OrderBy><FieldRef Name='ID' Ascending='True' /></OrderBy></Query>";
$().SPServices
({
operation: method,
async: false,
webURL: webURL,
listName: list,
CAMLViewFields: "<ViewFields Properties='True' />",
CAMLQuery: query,
completefunc: function (xData, Status)
{
$(xData.responseXML).SPFilterNode("z:row").each(function()
{
var ID = $(this).attr("ows_ID");
var title = $(this).attr("ows_Title");
var Dept = $(this).attr("ows_Department");
var Project = $(this).attr("ows_Project");
var EndDate = $(this).attr("ows_End_x0020_Date");
$("#myDataTable").append("<tr align='middle'>" +
$("#myDataTable").append("<tr align='middle'>" +
"<td align='left'>"+ID+"</td>" +
"<td align='left'>"+ title+"</td>" +
"<td align='left'>"+ Dept+"</td>" +
"<td align='left'>"+ Project+"</td>" +
"<td align='left'>"+ EndDate+"</td>" + "</tr>");
});
}
});
};
</script>
</body>
</html>
Leave your comments below.
Step 7: If you need to remove the identity that the code was generated from Content Editor Web Part, within the Web Part Setting, Under Appearance, For Chrome Type select "None". Click OK. Click Apply. Publish the Page.
Leave your comments below.
6 comments:
Where is the file for tree.js.
It is not working for me
I need this functionality to work.I tried all,But its not working
where is tree.js file .its giving me error .can you please update on that.Thanks
For what it's worth: it worked just fine for me once I removed the line that refers to the tree.js script (probably a copy/paste from another code sample).
Greate Solution and really clear explanation!!!! works nice in Shrp 2013. Thank you very much for your help
Can anyone please help me out to know how can we export document library field contents to excel file in share point 2013?
Post a Comment