The aim of the article is to help users to achieve the data accuracy of address with better user experience for filling the address in D365. This solutioning helps the users to auto-complete addresses by just entering the leading text rather than having to fill out the complete lines of address.
Below diagram illustrates the working solution
Below are the steps to achieve this.
Prerequisites : Need to have a Bing Maps API Key to achieve this. ( A trial key can be obtained from here)
1. Create a html web resource in D365 with the below code. Replace the key in the bing maps api call with the one you have obtained. Update the selectedSuggestion method to assign values to CRM address fields based on suggestionresult.
<title>autosuggestuiHTML</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">body{margin: 0;padding:0;overflow:hidden;font-family:'Segoe UI',Helvetica,Arial,Sans-Serif}</style>
<div id="printoutPanel" style="font-family: undefined;"></div>
<div id="searchBoxContainer" style="font-family: undefined;"><input id="searchBox" type="text"></div>
<div id="myMap" style="width: 100vw; height: 100vh; font-family: undefined;"></div>
<script type="text/javascript">
function loadMapScenario() {
var map = new Microsoft.Maps.Map(document.getElementById('myMap'), {
/* No need to set credentials if already passed in URL */
center: new Microsoft.Maps.Location(47.606209, -122.332071),
zoom: 12 });
Microsoft.Maps.loadModule('Microsoft.Maps.AutoSuggest', function () {
var options = {
maxResults: 4//,
//map: map
};
var manager = new Microsoft.Maps.AutosuggestManager(options);
manager.attachAutosuggest('#searchBox', '#searchBoxContainer', selectedSuggestion);
});
function selectedSuggestion(suggestionResult) {
map.entities.clear();
map.setView({bounds: suggestionResult.bestView });
var pushpin = new Microsoft.Maps.Pushpin(suggestionResult.location);
map.entities.push(pushpin);
document.getElementById('printoutPanel').innerHTML =
'Suggestion: ' + suggestionResult.formattedSuggestion +
'<br> Lat: ' + suggestionResult.location.latitude +
'<br> Lon: ' + suggestionResult.location.longitude;
}
}
</script>
<script src="https://www.bing.com/api/maps/mapcontrol?key=Ahnv3l6aFkyTPbz9eG6C0Gyw37IqZETDsS-zSnhqlJBKYYidGFJ8Pf0O4DOF0O9T&callback=loadMapScenario" defer="" type="text/javascript" async=""></script>
</body></html>
2. Place it on the Contact form and Verify the properties of the Web Resource
3. Publish the Entity.
Is there a way to auto fill these values into the corresponding fields? That would be ideal
ReplyDeleteThe object suggestionResult.formattedSuggestion contains the selected suggestion that could be assigned to the fields.
ReplyDeleteI got what i am seraching from last few days in your Blog. I hope you will share more info about it. Please keep sharing.
ReplyDeleteLaptop Service center in Ameerpet
Dell Service center in Ameerpet
HP Service center in Ameerpet
Lenovo Service center in Ameerpet
This comment has been removed by the author.
ReplyDeleteI think you did an awesome job explaining it. Sure beats having to research it on my own. Thanks
ReplyDeleteAgra BCom Time Table 2020
Allahabad BCom Time Table 2020
Brij BCOM TimeTable 2020
Excellent post. I absolutely appreciate this site.
ReplyDeletemost profitable items to sell on ebay
This is such a great resource that you are providing and you give it away for free. I love seeing blog that understand the value of providing a quality resource for free. maps.lol/petco-us-nd-11228
ReplyDeleteThis comment has been removed by the author.
ReplyDeleteWynn Resorts Completes $200M Renovation - The Jet
ReplyDeleteWynn Resorts announced 포천 출장마사지 today 대구광역 출장마사지 that it is now completing 동두천 출장마사지 the 상주 출장마사지 $200 million renovation project for Wynn 전주 출장마사지 Resorts.