{"id":3357,"date":"2016-07-27T18:04:32","date_gmt":"2016-07-27T12:34:32","guid":{"rendered":"https:\/\/www.inogic.com\/blog\/?p=3357"},"modified":"2023-02-28T14:13:14","modified_gmt":"2023-02-28T08:43:14","slug":"execute-web-api-request-using-angular-js-in-dynamics-crm","status":"publish","type":"post","link":"https:\/\/www.inogic.com\/blog\/2016\/07\/execute-web-api-request-using-angular-js-in-dynamics-crm\/","title":{"rendered":"Execute Web API request using Angular JS in Dynamics CRM"},"content":{"rendered":"

Introduction<\/strong><\/p>\n

In our earlier blogs of \u00a0Web API<\/a>\u00a0introduced in Dynamics CRM 2016, we have explained different requests and functions of Web API to querying and performing operations in Dynamics CRM.<\/p>\n

This blog will show you how to execute Web API request using Angular JS.<\/p>\n

This article would be helpful for those who have knowledge of Angular JS and now want to know how to use Angular JS to perform operations in Dynamic CRM.<\/p>\n

Angular JS provides in-built service \u201c$http\u201d that facilitates communication with the remote HTTP servers via XMLHttpRequest object or via JSONP. In JQuery, $.ajax is used for same purpose.<\/p>\n

So, we can use \u201c$http\u201d service to execute Web API request.<\/p>\n

Below is the code snippet that executes Web API function:<\/p>\n

     $http({\r\n                url: encodeURI(Xrm.Page.context.getClientUrl() + \"\/api\/data\/v8.0\/RetrieveVersion()\"),\r\n                dataType: 'json',\r\n                method: 'GET',\r\n                headers: {\r\n                    \"Content-Type\": \"application\/json\"\r\n                }\r\n            }).success(function (response) {\r\n                successCallback(response.Version);\r\n            })\r\n        .error(function (error) {\r\n            errorCallback(error);\r\n        });\r\n<\/pre>\n
You can see that, we pass Web API request to retrieve version of Dynamics CRM to URL. Execute \u201cRetrieveVersion()\u201d function, similarly you can execute other Web API functions like \u201cWhoAmI()\u201d, \u201dGetDefaultPriceLevelRequest<\/a>()\u201d, etc.<\/p>\n
Below is the code snippet that query Dynamics CRM data,<\/p>\n
  $http({\r\n                url: encodeURI(Xrm.Page.context.getClientUrl() + \"\/api\/data\/v8.0\/accounts?$select=name&$top=3\"),\r\n                dataType: 'json',\r\n                method: 'GET',\r\n                headers: {\r\n                    \"Accept\": \"application\/json\",\r\n                    \"OData-MaxVersion\": \"4.0\",\r\n                    \"OData-Version\": \"4.0\",\r\n                    \"Prefer\": \"odata.maxpagesize=3\"\r\n                }\r\n            }).success(function (response) {\r\n                successCallback(response);\r\n            })\r\n       .error(function (error) {\r\n           errorCallback(error);\r\n       });\r\n<\/pre>\n
In this code, we have passed Web API query to select top 3 accounts. Here, the only difference between above code and the code that executes Web API function is URL and headers.<\/p>\n
Conclusion<\/strong>:<\/p>\n
If you are developing an application for Dynamics CRM using Angular JS, we can use $http service to get Dynamics CRM data or perform operations in Dynamics CRM.<\/p>\n
Completed \u00a0with Dynamics CRM implementation? Whats next? Monitor User Adoption<\/a>!<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"
Introduction In our earlier blogs of \u00a0Web API\u00a0introduced in Dynamics CRM 2016, we have explained different requests and functions of Web API to querying and performing operations in Dynamics CRM. This blog will show you how to execute Web API request using Angular JS. This article would be helpful for those who have knowledge of\u2026 Read More »<\/a><\/span><\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[15,19,33,65],"tags":[708,756,757,1813],"class_list":["post-3357","post","type-post","status-publish","format-standard","hentry","category-development","category-dynamics-crm","category-javascript","category-webapi","tag-dynamics-crm-web-api","tag-execute-web-api-request","tag-execute-web-api-request-using-angular-js","tag-web-api"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/3357","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/comments?post=3357"}],"version-history":[{"count":0,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/3357\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/media?parent=3357"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/categories?post=3357"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/tags?post=3357"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}