I'm working with data to create a search tool where the user can search for the name of an individual involved in a legal case; the tool will output a table with the individual's name and role (with some other details about the case) in the following format:

I'm making AJAX calls to the API endpoint to fetch this data, and an example of a returned object is as follows:

    {
        "id": 3,
        "institution": [
            "Institution X"
        ],
        "party": [
            "Test Investments X.Y.",
            "Czech Republic"
        ],
        "chairperson": [
            "Jane Doe",
            "Olive Yew"
        ],
        "arbitratorClaimant": [
            "Hugo First"
        ],
        "arbitratorRespondent": [
            "Greg Arias"
        ],
        "secretary": [
            "Simon Sais"
        ],
        "lawFirmClaimant": [
            "Frank & Stein"
        ],
        "lawyerClaimant": [
            "John Smith"
        ],
        "lawFirmRespondent": [
            "Jen & Tile"
        ],
        "lawyerRespondent": [
            "Anita Bath"
        ],
        "expertFirmClaimant": [
            "Fran & Tick"
        ],
        "expertClaimant": [
            "Laura Biding"
        ],
        "expertFirmRespondent": [
            "Rose & Bush"
        ],
        "expertRespondent": [
            "Peter Owt"
        ],
        "name": "Case 1",
        "caseType": "investment",
        "caseStatus": "concluded",
        "awardDate": "2021-07-04",
        "note": "",
        "chairAppointment": "party agreement",
        "claimantAppointment": "co-arbitrators",
        "respondentAppointment": "other"
    }

In order to display the role of the individual that was searched for by the user in the table, I need a way to search through the returned object to find which key the name is associated with. For instance, in Case 1, John Smith was a lawyer for the Claimant, so I need a function that returns "lawyerClaimant" when searching through the object.

Here is the beginning of the function to request data from the API and display it in the table:

function requestCases() {
        var requestCase = document.getElementById('case-search-input').value;
        var requestConnections = document.getElementById('connections-search-input').value;
        var xhr = new XMLHttpRequest();
        xhr.open('GET', `api/case-list/?first-person=${requestCase}&second-person=${requestConnections}`, true);

        xhr.onload = function() {
            if(this.status == 200) {
                if (requestCase=='' && requestConnections=='') {
                    return null; 
                }

                else if (requestCase==requestConnections) {
                    return null;
                }
                
                else if (individualsArray.includes(requestCase) && requestConnections=='') {
                    var cases = JSON.parse(this.responseText);
                    var caseTable = '<table class="styled-table"><thead><tr><th>Case Name</th><th>Person (Natural)</th><th>Role</th><th>Status</th></tr></thead><tbody>';
                    if (cases.length >= 1) {
                        for (var i in cases.slice(0,3)) {
                            console.log(cases[i]);
                        }

I've searched through other posts and found a few variations of functions like this:

function getKeyByValue(object, value) {
  return Object.keys(object).find(key => object[key].includes(value));
}

getKeyByValue(cases[i], requestCase);

However, when I attempt to use anything like this, I get a ".includes is not a function" TypeError. Could anyone help guide me in the right direction?

Thank you!

CodePudding user response：

The problem is that some of the properties of the object aren't arrays, e.g. "id": 3. You'll get that error when it tries to use .includes() there. So first check that the value is an array:

function getKeyByValue(object, value) {
  return Object.keys(object).find(key => Array.isArray(object[key]) && object[key].includes(value));
}