query a calendar not working

Question

I am trying to query a calendar where it only returns the next event(so the item in the calendar that is closest to todays date including todays date), but I am running into some issues. It is returning the last item added. My code is as follows :

SP.SOD.executeFunc('sp.js', 'SP.ClientContext', startProgram);


function startProgram(){
var clientContext = new SP.ClientContext.get_current();
var oList = clientContext.get_site().get_rootWeb().get_lists().getByTitle('NBS Calendar');


var camlQuery = new SP.CamlQuery();

camlQuery.set_viewXml('<Query><Where><Gt><FieldRef Name="EventDate"/><Value Type="DateTime"><Today/></Value></Gt></Where></Query>');
this.collListItem = oList.getItems(camlQuery);



clientContext.load(collListItem);



clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));        
 }  

function onQuerySucceeded(sender, args) {

var listItemEnumerator = collListItem.getEnumerator();
var count =  0;
var currentTime = new Date()

// create an array
var monthsArr = new Array();
// get current month
var currMonth = currentTime.getMonth();
// store month names into our array
monthsArr[0] = "January";
monthsArr[1] = "February";
monthsArr[2] = "March";
monthsArr[3] = "April";
monthsArr[4] = "May";
monthsArr[5] = "June";
monthsArr[6] = "July";
monthsArr[7] = "August";
monthsArr[8] = "September";
monthsArr[9] = "October";
monthsArr[10] = "November";
var day = currentTime.getDate()
var year = currentTime.getFullYear()



while (listItemEnumerator.moveNext()) {

        var oListItem = listItemEnumerator.get_current();

        oListItem.get_item('Title');


}
document.getElementById("addNextEventHere").innerHTML = '<b>'+day + "th " +  monthsArr[currMonth] + ' ' +year +'</b>  <img src="http://scratch.nbsdev.co.uk/Dave/PublishingImages/calendar.png" width = 50 height=50></br>';
    document.getElementById("addNextEventHere").innerHTML += oListItem.get_item('Title');
        }



function onQueryFailed(sender, args) {

alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}

Answer 1

Your loop is strange.... I guess your code should look more like that:

SP.SOD.executeFunc('sp.js', 'SP.ClientContext', startProgram);
function startProgram() {
  var clientContext = new SP.ClientContext.get_current();
  var oList = clientContext.get_site() .get_rootWeb() .get_lists() .getByTitle('NBS Calendar');
  var camlQuery = new SP.CamlQuery();
  camlQuery.set_viewXml('<Query><Where><Gt><FieldRef Name="EventDate"/><Value Type="DateTime"><Today/></Value></Gt></Where></Query>');
  this.collListItem = oList.getItems(camlQuery);
  clientContext.load(collListItem);
  clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
}
function onQuerySucceeded(sender, args) {
  var listItemEnumerator = collListItem.getEnumerator();
  var count = 0;
  var currentTime = new Date()
  // create an array
  var monthsArr = new Array();
  // get current month
  var currMonth = currentTime.getMonth();
  // store month names into our array
  monthsArr[0] = 'January';
  monthsArr[1] = 'February';
  monthsArr[2] = 'March';
  monthsArr[3] = 'April';
  monthsArr[4] = 'May';
  monthsArr[5] = 'June';
  monthsArr[6] = 'July';
  monthsArr[7] = 'August';
  monthsArr[8] = 'September';
  monthsArr[9] = 'October';
  monthsArr[10] = 'November';
  var day = currentTime.getDate()
  var year = currentTime.getFullYear()
  // here I'd do the below changes
  var elem = document.getElementById('addNextEventHere');
  elem.innerHTML = '<b>' + day + 'th ' + monthsArr[currMonth] + ' ' + year + '</b>  <img src="http://scratch.nbsdev.co.uk/Dave/PublishingImages/calendar.png" width = 50 height=50></br>';
  while (listItemEnumerator.moveNext()) {
    var oListItem = listItemEnumerator.get_current();
    elem.innerHTML += oListItem.get_item('Title');
  }
}
function onQueryFailed(sender, args) {
  alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}