Esteban V Esteban V - 4 months ago 16
Javascript Question

How to load explicitly columns with javascript from sharepoint list

The following code works perfect

$(document).ready(function () {
var scriptbase = "/_layouts/15/";
$.getScript(scriptbase + "SP.Runtime.js");
ExecuteOrDelayUntilScriptLoaded(ready, "SP.Runtime.js");
})

function ready() {
var scriptbase = "/_layouts/15/";
$.getScript(scriptbase + "SP.js", function(){
var d = $.Deferred();
var path = document.location.href
console.log(path);
var context = new SP.ClientContext('http://myserver/centrodeprocesos/procesos');
var oList = context.get_web().get_lists().getByTitle('ImagenesDeFondo');
var camlQuery = SP.CamlQuery.createAllItemsQuery();
var collTermListItem = oList.getItems(camlQuery);
context.load(collTermListItem);
var o = {d: d, collTermListItem:collTermListItem};
context.executeQueryAsync(
Function.createDelegate(o, onQuerySucceeded),
Function.createDelegate(o, onQueryFailed));
return d.promise();
});
}


function onQuerySucceeded()
{
var listItemEnumerator = this.collTermListItem.getEnumerator();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
console.log(oListItem.get_item('Title'));
//console.log(oListItem.get_item('Url'));
}
this.d.resolve(oListItem);
}

function onQueryFailed() {
this.d.reject("something bad happened");
}


However I need to also print the URL which is a field in the list

$(document).ready(function () {
var scriptbase = "/_layouts/15/";
$.getScript(scriptbase + "SP.Runtime.js");
ExecuteOrDelayUntilScriptLoaded(ready, "SP.Runtime.js");
})

function ready() {
var scriptbase = "/_layouts/15/";
$.getScript(scriptbase + "SP.js", function(){
var d = $.Deferred();
var path = document.location.href
console.log(path);
var context = new SP.ClientContext('http://myserver/centrodeprocesos/procesos');
var oList = context.get_web().get_lists().getByTitle('ImagenesDeFondo');
var camlQuery = SP.CamlQuery.createAllItemsQuery();
var collTermListItem = oList.getItems(camlQuery);
context.load(collTermListItem, 'Include(Url)');
var o = {d: d, collTermListItem:collTermListItem};
context.executeQueryAsync(
Function.createDelegate(o, onQuerySucceeded),
Function.createDelegate(o, onQueryFailed));
return d.promise();
});
}


function onQuerySucceeded()
{
var listItemEnumerator = this.collTermListItem.getEnumerator();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
console.log(oListItem.get_item('Title'));
console.log(oListItem.get_item('Url'));
}
this.d.resolve(oListItem);
}

function onQueryFailed() {
this.d.reject("something bad happened");
}


The error is the property has not been initialized or need to be requested explicitly.

Answer

SP.ClientContext.load method allows to specify which properties have to be requested. In the example you have provided, only Url property is requested:

context.load(collTermListItem, 'Include(Url)');

but two properties are excepted as a result:

console.log(oListItem.get_item('Title'));  //<--this property is not initialized
console.log(oListItem.get_item('Url'));

So, the solution would be to request both properties:

context.load(collTermListItem, 'Include(Title,Url)'); 

Example

The following example demonstrates how to retrieve Title and Url properties from Images library:

var listTitle = 'Images';

var ctx = SP.ClientContext.get_current();
var list = ctx.get_web().get_lists().getByTitle(listTitle);   
var items = list.getItems(SP.CamlQuery.createAllItemsQuery());
ctx.load(items,'Include(Title,FileRef)');       

ctx.executeQueryAsync(
    function () { 
        for(var i = 0; i < items.get_count();i++) {
            var item = items.getItemAtIndex(i);
            console.log(item.get_item('Title'));
            console.log(item.get_item('FileRef'));       
        }
    },
    function (sender, args) { 
        //Error handling goes here..
    });
Comments