Difference between revisions of "AJAX and REST"
imported>Aeric |
Wikidevuser (talk | contribs) |
||
(33 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
The combination of [[JavaScript]] and the platform's [[REST API]]s lets you build a lot of power into a page that displays on a client-side browser. | The combination of [[JavaScript]] and the platform's [[REST API]]s lets you build a lot of power into a page that displays on a client-side browser. | ||
====About AJAX==== | ====About AJAX==== | ||
''AJAX'' is the name given to a set of [[JavaScript]] functions that let you connect to a server, get back data, and parse the data into something usable. It originally stood for "Asynchronous JavaScript and XML", but it can also use the JSON format for data interchange. | ''AJAX'' is the name given to a set of [[JavaScript]] functions that let you connect to a server, get back data, and parse the data into something usable. It originally stood for "Asynchronous JavaScript and XML", but it can also use the JSON format for data interchange. | ||
Perhaps the best summary of AJAX comes from the [http://www.w3schools.com/ w3c.schools tutorial]: | |||
:"AJAX is the art of exchanging data with a server, and updating parts of a web page, without reloading the whole page." | |||
While an arbitrary string can be passed to or from the server, the two most popular formats by far are {{^XML}} and {{^JSON}}. The platform understands both, so you can choose the flavor you prefer. (A common variation is to send XML data to the platform because it's easy to build up strings in XML format, and then get JSON back because that is the easiest format to parse in JavaScript.) | |||
''Learn more:'' [https://www.w3schools.com/js/js_ajax_intro.asp AJAX Tutorial] | |||
====Using AJAX in a Form==== | |||
The {{^jQuery}} functions included in the platform make it as simple as possible to make an AJAX call. | |||
The code is expected to be executed as part of a [[Form]], either as part of a [[Field Script]] or a [[Form Script]]. It builds up an XML string to send to a REST API. In this case, it creates the input XML required by the REST [[REST API:exec Resource|exec]] API, which executes a method in a Java class. And then tells the API to return JSON, which allows individual elements to be accessed by specifying little more than a JavaScript path. | |||
For more information about using AJAX in a form, see the tech community article [https://tech.forums.softwareag.com/t/how-to-invoke-a-class-from-formscript-using-ajax/237541 How to invoke a class from formscript using AJAX]. | |||
====Using AJAX in a JSP Page==== | |||
When you create a [[Pages|Page]] in the platform, you are creating a JSP page. You can embed Java code in that page, and use it to directly interact with the platform. Or you can use AJAX and the REST APIs, whichever is easiest. | |||
For information on using AJAX in a JSP page, see the tech community article [https://tech.forums.softwareag.com/t/invoking-rest-api-calls-using-ajax-in-agileapps-pages/237543 Invoking REST API Calls using AJAX in AgileApps Pages]. | |||
: | |||
: | =====Example: Retrieving Data with a GET Request===== | ||
To view the example on how to retrieve data using a GET request, see the tech community article [https://tech.forums.softwareag.com/t/retrieving-data-with-a-get-request/237537 Retrieving Data with a GET Request]. | |||
: | |||
: | =====Example: Validating a CSRF session for POST, PUT, and DELETE===== | ||
You have to validate a CSRF session for POST, PUT, and DELETE requests. For information about validating a CSRF session, see the Tech Community article at [https://tech.forums.softwareag.com/t/validating-a-csrf-session-for-post-put-and-delete/237538 Validating a CSRF session for POST, PUT, and DELETE]. This article provides sample codes for validating CSRF sessions for Form Submissions and REST APIs. | |||
{{ | {{Note|Ensure to add the header X-XSRF-TOKEN with value of xsrfToken from the login response.}} | ||
====Example: Retrieving | =====Example: Retrieving a JSON output of Dynamic Search API on a custom object===== | ||
{{ | {{Note| This is applicable only for the legacy UI}} | ||
To retrieve a JSON output of Dynamic Search API on a custom object, refer to this example: | |||
:<syntaxhighlight lang="javascript" enclose="div"> | |||
var recordData = []; | |||
:<syntaxhighlight lang=" | $.ajax({ | ||
type: 'GET', | |||
url: '/networking/rest/record/cases?fieldList=subject,description&alt=json', | |||
processData: true, | |||
dataType: 'json', | |||
async:false, | |||
success: function(data) | |||
{ | |||
if (data.platform.record instanceof Array ) | |||
{ | |||
recordData = data.platform.record ; | |||
} | |||
else if ( typeof data.platform.record != 'undefined' ) | |||
{ | |||
recordData.push(data.platform.record); | |||
} | |||
alert(recordData); | |||
} | |||
}); | |||
</syntaxhighlight> | </syntaxhighlight> | ||
<noinclude> | <noinclude> | ||
[[Category:Tools and APIs]] | [[Category:Tools and APIs]] | ||
</noinclude> | </noinclude> |
Latest revision as of 05:24, 17 May 2024
The combination of JavaScript and the platform's REST APIs lets you build a lot of power into a page that displays on a client-side browser.
About AJAX
AJAX is the name given to a set of JavaScript functions that let you connect to a server, get back data, and parse the data into something usable. It originally stood for "Asynchronous JavaScript and XML", but it can also use the JSON format for data interchange.
Perhaps the best summary of AJAX comes from the w3c.schools tutorial:
- "AJAX is the art of exchanging data with a server, and updating parts of a web page, without reloading the whole page."
While an arbitrary string can be passed to or from the server, the two most popular formats by far are XML and JSON. The platform understands both, so you can choose the flavor you prefer. (A common variation is to send XML data to the platform because it's easy to build up strings in XML format, and then get JSON back because that is the easiest format to parse in JavaScript.)
Learn more: AJAX Tutorial
Using AJAX in a Form
The jQuery functions included in the platform make it as simple as possible to make an AJAX call.
The code is expected to be executed as part of a Form, either as part of a Field Script or a Form Script. It builds up an XML string to send to a REST API. In this case, it creates the input XML required by the REST exec API, which executes a method in a Java class. And then tells the API to return JSON, which allows individual elements to be accessed by specifying little more than a JavaScript path.
For more information about using AJAX in a form, see the tech community article How to invoke a class from formscript using AJAX.
Using AJAX in a JSP Page
When you create a Page in the platform, you are creating a JSP page. You can embed Java code in that page, and use it to directly interact with the platform. Or you can use AJAX and the REST APIs, whichever is easiest.
For information on using AJAX in a JSP page, see the tech community article Invoking REST API Calls using AJAX in AgileApps Pages.
Example: Retrieving Data with a GET Request
To view the example on how to retrieve data using a GET request, see the tech community article Retrieving Data with a GET Request.
Example: Validating a CSRF session for POST, PUT, and DELETE
You have to validate a CSRF session for POST, PUT, and DELETE requests. For information about validating a CSRF session, see the Tech Community article at Validating a CSRF session for POST, PUT, and DELETE. This article provides sample codes for validating CSRF sessions for Form Submissions and REST APIs.
Example: Retrieving a JSON output of Dynamic Search API on a custom object
To retrieve a JSON output of Dynamic Search API on a custom object, refer to this example:
- <syntaxhighlight lang="javascript" enclose="div">
var recordData = []; $.ajax({
type: 'GET', url: '/networking/rest/record/cases?fieldList=subject,description&alt=json', processData: true, dataType: 'json', async:false, success: function(data) {
if (data.platform.record instanceof Array ) { recordData = data.platform.record ; } else if ( typeof data.platform.record != 'undefined' ) { recordData.push(data.platform.record); } alert(recordData); } }); </syntaxhighlight>