SharePoint Client Object Model - How to read a list with the same name in multiple sites

Question

My problem is the following:

I have a list under the site collection root representing projects called 'Project Register'. Each item in that list represents a project where I am storing the project name, status, URL and some other properties. The URL is stored because each item will have a corresponding SharePoint sub site under the same site collection that is created dynamically via a custom event receiver created in Visual Studio.

Each project sub site has a list called 'Members' used to keep track of the people that is assigned to that project. This is a business requirement and this list is used for some other purposes outside the scope of this question.

Now, my challenge is that I need to show in a dropdownlist of another list called 'Timesheet' the projects in which the logged user has been assigned to. This is to give the user the capabilities to enter the time spent in those projects. This timesheet list is nothing but an out-of-the-box SharePoint calendar list with some custom fields.

Below is the code I'm using but it keeps giving me the following error when retrieving the members list.

Uncaught TypeError: Cannot call method 'apply' of undefined

Could anyone point me out in the right direction?

The code I am using is in a custom .js file that I have properly referenced in my master page:

 $(document).ready(function () {

    SP.SOD.executeOrDelayUntilScriptLoaded(loadMyProjects,'SP.js');

 });

    var $ddlMyProjectsNewItem;
    var allProjects = new Array();

    function loadMyProjects()
    {

    $ddlMyProjectsNewItem = $("#ctl00_ctl32_g_03acc13b_954d_4bdc_9544_b379206bc9d5_ctl00_ctl05_ctl00_ctl00_ctl00_ctl04_ctl00_Lookup");
    var isTimesheetNewForm = $ddlMyProjectsNewItem.attr("id") != undefined ? true : false;

    if(!isTimesheetNewForm)
    {
        return;
    }

    $ddlMyProjectsNewItem.empty();


    // Get the current client context.
    var clientContext = SP.ClientContext.get_current();
    var web = clientContext.get_web();

    var list = web.get_lists().getByTitle('Project Register'); 
    var camlQuery = new SP.CamlQuery();

   camlQuery.set_viewXml("<View>" +
   "<ViewFields>" +
        "<FieldRef Name='Full_x0020_Project_x0020_Name' />" +
        "<FieldRef Name='ID' />" +
        "<FieldRef Name='Links' />" +
    "</ViewFields>" +
    "<Query>" +
        "<Where>" +
            "<Eq>" +
                "<FieldRef Name='Status' />" +
                "<Value Type='Lookup'>WIP</Value>" +
            "</Eq>" +
       "</Where>"+
        "<OrderBy>" +
            "<FieldRef Name='Full_x0020_Project_x0020_Name' Ascending='FALSE' />" +
        "</OrderBy>" + 
    "</Query>" +
    "</View>");

    this.collListItem = list.getItems(camlQuery);

    clientContext.load(collListItem);

    clientContext.executeQueryAsync(Function.createDelegate(this, this.onProjectsQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));        

}

function onProjectsQuerySucceeded(sender, args) {

    var listItemEnumerator = collListItem.getEnumerator();

    while (listItemEnumerator.moveNext()) {

        var oListItem = listItemEnumerator.get_current();
        var projectId = oListItem.get_id();
        var projectName = oListItem.get_item('Full_x0020_Project_x0020_Name');
        var projectUrl = oListItem.get_item('Links');

        allProjects.push(projectId + "|" + projectName  + "|" + projectUrl);
    }

    $.each( allProjects, function( key, value ) {

        var projectMembers = new ProjectSiteMembers(value);
        projectMembers.get_members();

    });  

}

function ProjectSiteMembers(projectData) {
   // console.log(projectData);

    var projectValues = projectData.split('|');
    this.projectId = projectValues[0];
    this.projectName = projectValues[1];
    this.projectUrl = projectValues[2];

    this.clientContext = null;
    this.website = null;
    this.membersList = null;
    this.collListItemMembers = null;    
}

// Define the class methods.
ProjectSiteMembers.prototype = {
    get_members: function () {

        //console.log(this.projectUrl);

        this.clientContext = new SP.ClientContext(this.projectUrl);
        this.website = this.clientContext.get_web();

        this.membersList = this.clientContext.get_web().get_lists().getByTitle('Members')


        var camlQuery = new SP.CamlQuery();
        camlQuery.set_viewXml("<View>" +
   "<ViewFields>" +
        "<FieldRef Name='Member' />" +
    "</ViewFields>" +
    "<Query>" +
        "<Where>" +
            "<Eq>" +
                "<FieldRef Name='Member' />" +
                "<Value Type='Integer'>" +
                    "<UserID Type='Integer' />" +
         "      </Value>" +
            "</Eq>" +
        "</Where>"+
    "</Query>" +
    "</View>");

        this.collListItemMembers = this.membersList.getItems(camlQuery);

        this.clientContext.load(this.collListItemMembers);

            // Everything works until this point
            // This is the line giving me the error
        this.clientContext.executeQueryAsync(Function.createDelegate(this, this.onProjectMembersQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));           
    }
};


function onProjectMembersQuerySucceeded(sender, args) {

    //console.log(this.projectId + " - " + this.projectName);

    var listItemInfoMember = '';

    var listItemMemberEnumerator = collListItemMembers.getEnumerator();

    while (listItemMemberEnumerator.moveNext()) {
        var oListItemMember = listItemMemberEnumerator.get_current();


            $ddlMyProjectsNewItem 
                .append('<option value="' + this.projectId + '">' + this.projectName + '</option>');

    }        
}

function onQueryFailed(sender, args) {

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

Answer 1

After a review with a colleague we manage to fix the problem. It seems that I was doing an improper call to a method that was not defined in the scope of the javascript class. Those are the kind of silly mistakes that bug you out for several hours because you overlook them.

Below is the actual working code after some refactoring so anyone can have it here for future references.

 $(document).ready(function () {

    SP.SOD.executeOrDelayUntilScriptLoaded(loadMyProjects,'SP.js');

 });

    var $ddlMyProjects;
    var $ddlMyProjectsNewItem;
    var $ddlMyProjectsEditItem;
    var allProjects = new Array();

    function loadMyProjects()
    {

    $ddlMyProjectsNewItem = $("#ctl00_ctl32_g_03acc13b_954d_4bdc_9544_b379206bc9d5_ctl00_ctl05_ctl00_ctl00_ctl00_ctl04_ctl00_Lookup");
    $ddlMyProjectsEditItem= $("#ctl00_ctl32_g_23803b04_bdec_4c98_a4af_0b863da464c1_ctl00_ctl05_ctl00_ctl00_ctl00_ctl04_ctl00_Lookup");
    var isTimesheetNewForm = $ddlMyProjectsNewItem.attr("id") != undefined ? true : false;
    var isTimesheetEditForm = $ddlMyProjectsEditItem.attr("id") != undefined ? true : false;

    if(isTimesheetNewForm)
    {
        $ddlMyProjects = $ddlMyProjectsNewItem;
    }
    else if(isTimesheetEditForm)
    {
        $ddlMyProjects = $ddlMyProjectsEditItem;
    }
    else
    {
        return;
    }


    $ddlMyProjects.empty();


    // Get the current client context.
    var clientContext = SP.ClientContext.get_current();
    var web = clientContext.get_web();

    var list = web.get_lists().getByTitle('Project Register'); 
    var camlQuery = new SP.CamlQuery();

   camlQuery.set_viewXml("<View>" +
   "<ViewFields>" +
        "<FieldRef Name='Full_x0020_Project_x0020_Name' />" +
        "<FieldRef Name='ID' />" +
        "<FieldRef Name='Links' />" +
    "</ViewFields>" +
    "<Query>" +
        "<Where>" +
            "<Eq>" +
                "<FieldRef Name='Status' />" +
                "<Value Type='Lookup'>WIP</Value>" +
            "</Eq>" +
       "</Where>"+
        "<OrderBy>" +
            "<FieldRef Name='Full_x0020_Project_x0020_Name' Ascending='TRUE' />" +
        "</OrderBy>" + 
    "</Query>" +
    "</View>");

    this.collListItem = list.getItems(camlQuery);

    clientContext.load(collListItem);

    clientContext.executeQueryAsync(Function.createDelegate(this, this.onProjectsQuerySucceeded), Function.createDelegate(this, this.onProjectsQueryFailed));        

}

function onProjectsQuerySucceeded(sender, args) {

    var listItemEnumerator = collListItem.getEnumerator();

    while (listItemEnumerator.moveNext()) {

        var oListItem = listItemEnumerator.get_current();
        var projectId = oListItem.get_id();
        var projectName = oListItem.get_item('Full_x0020_Project_x0020_Name');
        var projectUrl = oListItem.get_item('Links');

        allProjects.push(projectId + "|" + projectName  + "|" + projectUrl);
    }

    $.each( allProjects, function( key, value ) {

        var projectMembers = new ProjectSiteMembers(value);
        projectMembers.get_members();

    });  

}

function onProjectsQueryFailed(sender, args) {

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

function ProjectSiteMembers(projectData) {
   // console.log(projectData);

    var projectValues = projectData.split('|');
    this.projectId = projectValues[0];
    this.projectName = projectValues[1];
    this.projectUrl = projectValues[2];

    this.clientContext = null;
    this.website = null;
    this.membersList = null;
    this.collListItemMembers = null;    
}

// Define the class methods.
ProjectSiteMembers.prototype = {

    onProjectMembersQuerySucceeded: function (sender, args) {

        console.log(this.projectId + " - " + this.projectName);

        var listItemInfoMember = '';

        var listItemMemberEnumerator = this.collListItemMembers.getEnumerator();

        while (listItemMemberEnumerator.moveNext()) {
            var oListItemMember = listItemMemberEnumerator.get_current();

                $ddlMyProjects.append('<option value="' + this.projectId + '">' + this.projectName + '</option>');
                return false;

        }        
    },

    onProjectMembersQueryFailed: function onQueryFailed(sender, args) {

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

    get_members: function () {

        console.log(this.projectUrl);

        this.clientContext = new SP.ClientContext(this.projectUrl);
        this.website = this.clientContext.get_web();

        this.membersList = this.clientContext.get_web().get_lists().getByTitle('Members')


        var camlQuery = new SP.CamlQuery();
        camlQuery.set_viewXml("<View>" +
   "<ViewFields>" +
        "<FieldRef Name='Member' />" +
    "</ViewFields>" +
    "<Query>" +
        "<Where>" +
            "<Eq>" +
                "<FieldRef Name='Member' />" +
                "<Value Type='Integer'>" +
                    "<UserID Type='Integer' />" +
         "      </Value>" +
            "</Eq>" +
        "</Where>"+ 
    "</Query>" +
    "</View>");

        this.collListItemMembers = this.membersList.getItems(camlQuery);

        this.clientContext.load(this.collListItemMembers );

        this.clientContext.executeQueryAsync(Function.createDelegate(this, this.onProjectMembersQuerySucceeded), Function.createDelegate(this, this.onProjectMembersQueryFailed));           
    }
};