Is there any way to call Callout for a custom list item

Question

I have 2 custom lists List1(Parent) and List2(Child).

The new form of List1 has been customized to create 'n' of items in List2 through dynamic forms. The item in List1 and items in List2 shared one unique value to have a parent-child relationship. Rest other columns in both the lists are different.

And on edit and display form of List1, I am able to get and bind the items from List2.

Here I need to display child items from List2 into the view of List1 and I know its practically not feasible since the columns in both the lists are different.

Is there any way to create a callout to display child items on click/mouseover of parent item or any other way to display child items on List1.

Or through jslink?

Note: The list has around 2K+ records in each list.

Answer 1

You can use the JS library SPServices.

There is a function called SPGetListItemsJson that you can use to retrieve the data you want.

Here's an example:

var traineePromise = $().SPServices.SPGetListItemsJson({
    listName: "Trainees",
    CAMLQuery: "<Query><Where><Eq><FieldRef Name='accountName' LookupId='TRUE'/><Value Type='Integer'>" + opt.traineeId + "</Value></Eq></Where></Query>",
    changeToken: opt.changeToken,
    mappingOverrides: {
        ows_Scores: {
            mappedName: "Scores",
            objectType: "JSON"
        },
        ows_Attendance: {
            mappedName: "Attendance",
            objectType: "JSON"
        }
    }
});

$.when(traineePromise).done(function() {
    thisTraineeUser = this.data;
});

More about SPGetListItemsJson