The app I'm working on is basically a conglomeration of some of the samples. It works fine as is. In it, if you click on a point in the map you will see the text from the feature's Description field update in the sidebar. I want the same thing to happen when you click an option in the "Search by Category" drop-down.
Working app is here
I've been working in the section of code that puts the pop-up result in the sidebar. I can't find a reproducible sample for what I want to do.
//Popup in sidebar
view.when().then(function () {
// Create a default graphic for when the application starts
const graphic = {
popupTemplate: {
content: "To search by item make sure Search by Category is set to 'Select one'.<br> <br>Businesses should note that they will find more appropriate listings if they check Business under the search box. Hit Search after changing from Residential to Business or vice versa."
},
};
// Provide a graphic to a new instance of a Feature widget
const feature = new Feature({
container: "sidebar",
graphic: graphic,
map: view.map,
spatialReference: view.spatialReference
});
// description variable
var sidebardescription = {
//autocasts the new template
content: [
{
//set a descriptive text element
type: "text", // TextContentElement
text: "{Description}"
},
]
};
view.whenLayerView(recycleLayer).then(function (layerView) {
let highlight;
// listen for the pointer-move event on the View
view.on("click", function (event) {
// Perform a hitTest on the View
view.hitTest(event).then(function (event) {
// Make sure graphic has a popupTemplate
let results = event.results.filter(function (result) {
return result.graphic.layer.popupTemplate;
});
let result = results[0];
highlight && highlight.remove();
// On pointer-click, update the graphic of the Feature widget
// with the result
if (result) {
feature.graphic = result.graphic.clone(); //clone it to avoid mutation
feature.graphic.popupTemplate = sidebardescription;
highlight = layerView.highlight(result.graphic);
} else {
feature.graphic = graphic;
}
});
console.info("popup chosen")
});
});
});
