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

Check out Best Alternative to InfoPath


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.


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.


You May Also like the Following SharePoint Online Tutorials: