Get SharePoint List Items and Display in Tabular Format using ECMA Script in SharePoint


This article explain how to get record from SharePoint List using ECMA Script Client Object Model (JSOM). I have added a content editor webart whish fectch the record from country List and display in tabular format.


New to Office 365 SharePoint Online? Get Office 365 Enterprise E3 Subscription & Try out all the features

Read some SharePoint 2013 tutorials below:

Below is the full code:




<script src=”/_layouts/SP.js”temp_src=”/_layouts/SP.js” type=”text/ecmascript”></script>
<script type=”text/javascript”>
function ViewItem() {
var table = document.getElementById(“cntryTable”);
while (table.rows.length > 1) {
table.deleteRow(1);
}

var context = new SP.ClientContext.get_current();
var web = context.get_web();
var list = web.get_lists().getByTitle(‘Country’);
var query = SP.CamlQuery.createAllItemsQuery();
allItems = list.getItems(query);
context.load(allItems, ‘Include(Title,Abbreviation)’);
context.executeQueryAsync(Function.createDelegate(this, this.success),
Function.createDelegate(this, this.failed));
}


function success() {
var TextFiled = “”;
var ListEnumerator = this.allItems.getEnumerator();
while (ListEnumerator.moveNext()) {
var currentItem = ListEnumerator.get_current();
var table = document.getElementById(“cntryTable”);
var row = table.insertRow(1);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = currentItem.get_item(‘Title’);
cell2.innerHTML = currentItem.get_item(‘Abbreviation’);
}
}
function failed(sender, args) {
alert(“failed. Message:” + args.get_message());
}</script>

<a onclick=”Javascript:ViewItem();” href=”#” temp_href=”#”>View Items</a>
<table id=”cntryTable” border=”1″>
<tbody>
<tr>
<th>
Country
</th>
<th>
Abbreviation
</th>
</tr>
</tbody>
</table>

Get Record from List and Display in Tabular Format using ECMA Script in SharePoint
Get Record from List and Display in Tabular Format using ECMA Script in SharePoint

Conclusion:
In this article I have explained how to get Record from a SharePoint List and display in tabular format using ECMA Script.

Check out Best Alternative to InfoPath -> Try Now

FREE SHAREPOINT 2019 PDF

(Installation & Features)