Czy w ten sposób mogę przekazywać parametr?

function showOnMap(id) {
            console.log("Show on map" + id);
            $("html, body").animate({ scrollTop: $('#map').offset().top }, 800);
        }

        function searchResult(data) {
            $("#searchResults").show();
            $("html, body").animate({ scrollTop: $('#search').offset().top }, 800);
            $('#tableResults tbody').html('');
            for (var i in data) {
                if (data.hasOwnProperty(i)) {
                    $('#tableResults tbody').append(
                        "<tr>" +
                        "<td class='nameCompany'>" +
                        data[i].CompanyName +
                        "<br /><button class='showOnMap' onclick='showOnMap(data[i].Id)'>" +
                        "POKAŻ NA MAPIE" +
                        "</button class='showOnMap'></td>" +
                        "</td>" +
                        "<td class='address'>" +
                        data[i].CompanyAddress +
                        "</td>" +
                        "<td class='phoneNumber'>" +
                        "tel. " + data[i].PhoneNumber +
                        "</td>" +
                        "<td class='installationPrice'>" +
                        data[i].PriceInstallation +
                        "</td>" +
                        "</tr>");
                }
            };
        }

Czy w ten sposób mogę przekazywać parametr do metody showOnMap w onclicku?

 "<br /><button class='showOnMap' onclick='showOnMap(data[i].Id)'>" 

Możesz, ale nie powinieneś.

Bo jeśli przekazuję w ten sposób to pokazuję mi błąd w konsoli na czerwono. Jak prawidłowo powinienem przekazać parametr do tej metody z onclicka?

Uczynny Karp napisał(a):

Bo jeśli przekazuję w ten sposób to pokazuję mi błąd w konsoli na czerwono. Jak prawidłowo powinienem przekazać parametr do tej metody z onclicka?

Zastanawiam sie nad ta linijka tutaj:

"</button class='showOnMap'></td>" 

Chyba nie powinno sie na zamknietym tagu dawac klase. A usun moze to class="...." i przetestuj.

Moze napisz funkcje $('.showOnMap').on('click', showOnMap(...)); powyzej petli for.

function showOnMap(id) {
  console.log("Show on map" + id);
  $("html, body").animate({ scrollTop: $("#map").offset().top }, 800);
}

function searchResult(data) {
  $("#searchResults").show();
  $("html, body").animate({ scrollTop: $("#search").offset().top }, 800);
  $("#tableResults tbody").html("");
  for (var i in data) {
    if (data.hasOwnProperty(i)) {
      $("#tableResults tbody").append(
        "<tr>" +
          "<td class='nameCompany'>" +
          data[i].CompanyName +
          "<br /><button class='showOnMap'>" +
          "POKAŻ NA MAPIE" +
          "</button></td>" +
          "</td>" +
          "<td class='address'>" +
          data[i].CompanyAddress +
          "</td>" +
          "<td class='phoneNumber'>" +
          "tel. " +
          data[i].PhoneNumber +
          "</td>" +
          "<td class='installationPrice'>" +
          data[i].PriceInstallation +
          "</td>" +
          "</tr>"
      );
    }
  }
}

let $button = document.querySelector('.showOnMap');
$button.addEventListener('click', showOnMap);

Spróbuj w ten sposób, ale upewnij się, że funkcja searchResult jest wywołana przed zaciągnięciem Buttona z DOMa, w przeciwnym wypadku dostaniesz błąd, że nie udało znaleźć się elementu.