How to call an M3-API with Angular JS and from a web page

I’m new to JAvascript, and Angular JS has given me a challenge but a great tool for manipulating web page content. It’s a MVC framework that’s recommended by a few colleagues.

The details below outline how to create a webpage to:

a) Get a list of customers ordered by Customer Number from M3
b) display on a web page the customer number, customer name and customer phone number.

This will be a custom webpage that can be called within Infor’s H5 client. As there are no customisations available yet, Javascript + Angular JS is a good open source alternative.

To get M3 data for use on a web page, in your Javascript with AngularJS included:

a) Create the URL to call the M3-API with any necessary parameters for the transaction :

var URL= “http:// {server url}/m3api-rest/execute/CRS610MI/LstByNumber;maxrecs=2?”

{server url} is like m3.client.com:20005. Make sure to use the un-encrpyted port, and to run the html also from the same unencrypted port. If you run the html from a different port, you will encounter CORS (Cross Origin Resource Sharing) security errors.

You can also refer to https://thibaudatwork.wordpress.com/2012/02/23/how-to-call-m3-api-with-rest-json

b) Have the $http injected in your controller:

customerApp.controller(‘CustomerCtrl’,
[‘$scope’, ‘$http’, function($scope,$http, $notifyService){

c) Use the URL on $http to make the call.

$http.get(URL).success(function(httpResponse )

d) Now parse the httpResponse which will have any messages as well as data. The httpResponse.metadata will have the layout of the reply.

“RowIndex”:”0″,”NameValue”:[{“Name”:”CONO”,”Value”:”100″},{“Name”:”DIVI”,”Value”:”TMW”},{“Name”:”LNCD”,”Value”:”GB”},

To transform the JSON/NameValue array to a { fieldName :value } array that can be opened in the html

{ CONO: “100”, DIVI: “TMW”, LNCD: “GB”,….

Use this logic:

$http.get(URL).success(function(httpResponse ){
$scope.MIRecords = data.MIRecord;//skip metadata and headers

//Parse to a map
for (var i in $scope.MIRecords) {//get records
oneRecord={};
//get fields and values
for (var j in $scope.MIRecords[i].NameValue){
oneRecord[$scope.MIRecords[i].NameValue[j].Name] //field name
= $scope.MIRecords[i].NameValue[j].Value; //field value
}
$scope.allCustomers[i]=oneRecord;
}

e) To display each customer in the allCustomers array on the HTML, use ng-repeat on the allCustomers array:

<tr ng-repeat=”oneCustomer in allCustomers | filter:query” >
<td>{{oneCustomer.CONO}}</td>
<td>{{oneCustomer.CUNM}}</td>
<td> {{oneCustomer.CUNO}}</td>
<td>{{oneCustomer.TFNO}}</td>
</tr>

 

 

-J/Jonathan San Juan