How do I get coordinates in a popup?

ITApplications

Good afternoon all

I'm just (for the first time)  attempting to build a simple ArcGIS API that will allow a customer to click on a street on a map (using our streets feature layer) and log a pothole defect. Please forgive me if I use the wrong terminology or my request is overly simple.

When a customer clicks on the street to log the pothole we need some basic info which we'll then capture. Using our streets feature layer I've created a popup which will give us three (out the four) essential details we need to pass back to our CRM system. 

The final detail we need to feed back is the X,Y coordinates for the exact geographical location of the pothole. so wherever the customer clicks on the street it will give us those exact coordinates.  I currently can't fathom how to get these to appear in the popup. I can add a reverse geocode service which gives me the coordinates but it then doesn't fire the popup from the feature layer, so I'm then missing 3 out of the 4 details. 

I'm hoping someone can please advise/show me the code of how to add this function to the popup. The API is in its early stage hence it currently being untidy.

Thank you in advance.

Ricky

Here is my current code: Master - Access features with point events (ESRI Map) (codepen.io)

Sample of my very basic popup code:

// Define a pop-up template for Streets
const popupStreetLayer = {
"title": "Drop Pin",
"content": "<b>Street:</b> {SITE_NAME}<br><b>Town:</b> {TOWN_NAME}<br><b>USRN:</b> {SITE_CODE}"
}
const streetLayer = new FeatureLayer({
url: "https://services6.arcgis.com/Qptn479QktK11k72/arcgis/rest/services/Stsearch/FeatureServer/0",
outFields: ["*"],
popupTemplate: popupStreetLayer
});

Screenshot 2022-03-24 142302.jpg

Screenshot (5).png

AndrewPurdon1_0-1618416124564.png

ITApplications

Hi Lauren

Thank you for the info. I've tried to incorporate the function option as suggested by Steve into the popup that displays coordinates as suggested by you. I can get the coordinates popup to fire up fine, but I can't get the function option to bring back the field from the feature layer. I'm sure I'm missing something somewhere, what have I missed?

https://codepen.io/RFletERYC/pen/RwxLroP

// Streets feature layer
var streetLayer = new FeatureLayer({
url: "https://services6.arcgis.com/Qptn479QktK11k72/arcgis/rest/services/StsearchTest/FeatureServer/0",
outFields: ["*"]
});

map.add(streetLayer, 0); //Adds Streets layer to map


view.popup.autoOpenEnabled = false;
view.on("click", (event) => {
// Get the coordinates of the click on the view
// around the decimals to 3 decimals
const x = Math.round(event.mapPoint.x * 1) / 1;
const y = Math.round(event.mapPoint.y * 1) / 1;

view.popup.open({
// Set the popup's title to the coordinates of the clicked location
title: "X, Y Coordinates: [" + x + ", " + y + "]",
location: event.mapPoint, // Set the location of the popup to the clicked location
content: setContentInfo
});
});
let template = new PopupTemplate ({
title: "Test",
content: "Site: {SITE_NAME}"
});

function setContentInfo(streetLayer){
let node = domConstruct.create("div", {innerHTML: "Text Element inside an HTML div element."});
return node;

}

Thank you in advance.