I'm learning Umbraco, and I have used a PartialViewMacroPage to consume external API, and display results in a table. I have also created a details button, which opens up a pop up modal. However, now, I want to be able to have a details page instead.

I have this function:

            function displayRecord(index) {
                var xhttp = new XMLHttpRequest();
                xhttp.open("GET", "https://api.dddd.com&startIndex=" + index + "&count=1&query=api_channel:visit&sortType=field&sortField=title&sortOrder=0", false);
                xhttp.send();

                var resultJSON = JSON.parse(xhttp.responseText);

                $(".modal-title").html(resultJSON.records[0].title)
                $(".modal-body").html(resultJSON.records[0].description)

                $("#btnShowMyModal").click();
            }

My idea (not sure whether correct, hope to get some feedback on this too, maybe this would be better with a controller?) is to pass the index param to the new view, and start populating div classes based on the index param.

I imagine I'd need a new controller with this function in it, returning the view, but how would I pass that index param across?