In your example you use list B and list A which are difficult to follow in the code examples. In my example I'll use these two fictional lists:
- List Project (Title, ProductOwner)
- List TimeReport (Hours, Date, Project:Title)
One can load a time report and see the corresponding Project Title.
Say, we want to load the whole lookup item and see even ProductOwner of the Project for a particular TimeReport.
This gets all the context and lists:
var ctx = SP.ClientContext.get_current();
var web = ctx.get_web();
var lists = web.get_lists();
var listTimeReport = lists.getByTitle("TimeReport");
var listProject = lists.getByTitle("Project");
//just get the first item
var timereport1 = listTimeReport.getItemById(1);
ctx.load(timereport1);
ctx.executeQueryAsync();
Lookup Field in JSOM
A lookup field in a JSOM SP.ListItem is an object (that's why toString() outputs [Object Object]
), which contains different fields:
var lookupField = timereport1.get_item("Project");
To get the actual value of the lookup field, the function called get_lookupValue has to be invoked. This gets the lookup field: the field from the other list, in many cases just Title, but it can be anything.
var lookupTitle = lookupField.get_lookupValue();

Other fields from the lookup item in JSOM
Maybe only the lookup field isn't enough. In the standard listviews we can click on the lookup field to open the list item from the lookup list. To do so in JSOM, we have to load this lookup item separately. There we the have the lookup id:
var lookupId = lookupField.get_lookupId();
With this id we can load the whole item. Of couse, we can use the CAML to get only fields we want. We can even load a bunch of lookup items at the same time. But in this simple example we load only one item:
var projectItem = listProject.getItemById(lookupId);
ctx.load(projectItem)
ctx.executeQueryAsync()
When we have loaded the the whole or parts of the corresponding project item, we can get all the fields from the project information, e.g. ProductOwner:
var productOwner = projectItem.get_item("ProductOwner");
The original code example
Here is an example of getting the title of the lookup field and the whole lookup item (with all fields):
Here is the original code example with List A and List B:
var ctx = SP.ClientContext.get_current();
var web = ctx.get_web();
var lists = web.get_lists();
var listB = lists.getByTitle("ListB");
var listA = lists.getByTitle("ListA");
//just get the first item
var listBItem = listB.getItemById(1);
ctx.load(listBItem)
ctx.executeQueryAsync(function() {
var listAItem = item.get_item("SubMenuItemIdRefTitle");
var listAItemId = listAItem.get_lookupId();
var title = listAItem.get_lookupValue();
alert(title);
var fullListAItem = listA.getItemById(listAItemId)
ctx.load(fullListAItem)
ctx.executeQueryAsync({
var modified = fullListAItem.get_item("Modified");
alert("Success. For example, we can get the Modified field of the lookup field: "
+ modified);
});
});
No error handling is provided for brevity. The id of the first item is hardcoded (1) just to simplify the example.