WaveMaker Docs

WaveMaker Docs

  • Get started
  • Widgets
  • Mobile
  • How-to
  • Enterprise
  • Releases
  • Blog
  • Sign-in

›Variables

Getting started

  • Introduction
  • Walkthrough

Pages

  • Pages Overview
  • Creating a Page
  • Layout and Styles

    • Page Layout
    • Templates
    • Themes
    • Accessibility

    Page Configure

    • Page Artefacts
    • Page Cache
    • Partial Page
    • Page Parameters
    • Examples

    Page Actions

    • Navigation
    • Events

    Custom Development

    • Theme Editor
    • Manual Theme
    • Create Template

SSPA

  • Micro Frontend App

Databases

  • Database Services Overview
  • Database Tools
  • Database Designing

    • Working with Databases
    • Data Modelling
    • DataBase Schema Modes
    • Working with DB Schema
    • Database Views
    • Temporal Support

    Accessing Database

    • Accessing Database

    Queries and Procedures

    • Working with Queries
    • Working with Stored Procedures
    • Version Queries & Procedures
    • Blob Queries and Procedures
    • Queries & Procedures - Java Services

    Database Variables & API

    • Database CRUD
    • CRUD Event Listeners
    • Database APIs
    • Database Service APIs

REST & SOAP

  • Web Services Overview
  • Restful

    • REST Services
    • Secure Server-side Properties
    • REST Request Timeouts
    • REST Services using OAuth 2.0

    SOAP

    • Working with SOAP Services
    • Imported SOAP APIs

    Websocket

    • Working with WebSockets

    APIs

    • API Designer
    • Mocking APIs
    • Mocking REST API
    • Swagger Import

    Variables

    • CRUD Variable
    • Service Variable
    • WebSocket Variable

Java Services

  • Java Service
  • Java Services

    • Java Integration Services
    • DB Service Integration
    • API Composition
    • Variables for Invocation
    • Generated REST APIs (API Designer)

    Java Services Variables & API

    • Variable for Java Service
    • Java Service APIs

    Source Files

    • Resources and Third-party Libraries
    • Using 3rd party JavaScript files
    • Using 3rd party jar files

Variables & Actions

    Variables

    • Variables Overview
    • Model Variable
    • Device Variables

    Binding

    • Variable Binding
    • Custom Formatter

    Actions

    • Actions
    • Navigation Action
    • Login Action
    • Logout Action
    • Timer Action
    • Notification Action

    Events

    • Events
    • JavaScript Access

Security

    App Security

    • Overview
    • Authentication
    • Authorization
    • Access Levels & Permissions
    • Login Configuration
    • Session Persistence
    • SSL Encryption
    • XSS antisamy policy configuration
    • OWASP
    • XSS Prevention
    • Central Authentication System
    • Token Based Authentication
    • SAML Integration
    • Secure Connection for Deployed Apps
    • Concurrent Sessions
    • HostHeader Injection

    Security Variable and API

    • Security Variables
    • Remember Me
    • Variable for Security Service
    • Security Service APIs

Developer options

  • Test and Run (Preview) Apps
  • Chrome Extension: Devtool
  • Debugging
  • Inspection Framework
  • Build Options
  • WaveMaker Mobile Apps Automation
  • Developer Integration

    • Project User Management
    • Developer Collaboration
    • Extending the Application using IDEs
    • Import, Export & Update Apps
    • Project Shells

    Add-ons

    • Localization
    • Artifacts Repository

Deployment

  • Overview
  • Deployment Profile
  • One-click Deployment
  • WaveMaker CI/CD Pipeline

    • Overview
    • Configuration Profiles
    • Configuration Management
    • Pipelines and Phases

    Pipeline Configuration

    • Default Pipelines in WMO
    • Configure Pipeline in WME

    Deploy to Cloud Providers

    • AWS
    • Azure
    • Google Cloud
    • DigitalOcean

    Pipeline Configuration cont.

    • Phase configurations
    • Webhooks Integration
    • Tests Integration

    Manage Deployed Apps

    • Manage Deployed Apps

    Integrate with your CI/CD Providers

    • Push Code to External repo
    • Custom VCS Integration
    • Export WaveMaker Application
    • Building Project with Maven
    • Build with Docker
    • Jenkins Integration
    • Deploy using Docker Compose
    • Deployment to Heroku

    WaveMaker apps Interation with CDN

    • App Integration with AWS CDN
    • App Integration with Azure CDN

    Deployment to external web servers

    • Application Server Overview
    • Deploy to Tomcat
    • WebSphere
    • JBoss - WildFly
    • WebLogic Server

Connectors

  • Introduction
  • Architecture
  • Import Connectors
  • List of Connectors
  • Build a New Connector

Teams

  • Overview
  • Team Setup
  • Dashboard
  • Manage Users
  • Manage Projects
  • Manage Prefabs
  • Project Branches
  • Manage Roles
  • Code Repository
  • Import VCS Project
  • Team Profile
  • Manage Subscription
  • FAQs
Edit

Service Variable


For every service imported into the app, the APIs exposed by the service can be accessed to perform many operations with it. A variable needs to be created to invoke the service and store the results of that invocation. The Variable operations are restricted by the offerings of the underlying service.

A comprehensive list of these APIs can be found from the API Designer after the import of the service.

note

Since the service needs to be invoked to fetch the data, the widgets bound to these variables will display values only at run-time, not in Studio mode.

How to Create a Service Variable

The data source for these Variables comes from imported REST and SOAP services. You can create a Service variable by using the following two approaches depending on the source of the data.

  1. Service Variable for Web Service (REST APIs, SOAP, WebSocket)
  2. Service Variable for Imported APIs (Swagger/Open API)
important

The process for creating a variable for WebSocket Service is the same as below, however, the properties and methods are different. For more information, see WebSocket Variable.

select web services

Service Variable for Web Services

  1. Select Variable from the workspace toolbar.

variable creation

  1. Click New Variable from the Variable Dialog.

new variable

  1. Select Web Services as a target action for Variable.

select web services

  1. In the new Variable dialog, configure the properties for the variable.
important

The data source for the Variable comes from the imported Services.

web service variable

  • Service: Select the service name from imported services.
  • Name: Set by default, but you can modify it.
  • Owner: The scope of the Variable. Page is the default option. You can choose Application to make it available across the app.
  • Click Done to complete the variable creation process.

Service Variable for Imported APIs

  1. Select Variable from the workspace toolbar.

variable creation

  1. Click New Variable from the Variable Dialog.

new variable

  1. Select Imported APIs as a target action for Variable.

select imported api

  1. In the new Variable dialog, configure the properties for the variable.

swagger variable

note

You can create a CRUD variable to perform create, read, update, delete operations using the Entities (CRUD) option. For more information, see Service Variable.

  • Service: Select the Imported Service.
  • Type: Select the Type as Other Endpoints.
  • Method: If the API exposes multiple services, you can choose from the list.
  • Name: Set by default, but you can modify it.
  • Owner: The scope of the Variable. Page is the default option. You can choose Application to make it available across the app.
  • Click Done to complete the variable creation process.

Variable Properties and Events

variable creation

You will be directed to the Variables page, with the new variable listed. You can see the following options.

crud variable properties

  1. Name: You can modify the variable name.
  2. Owner: The scope of the Variable. Page is the default option. You can choose Application to make it available across the app.
  3. A new Web Service variable created with the default exposed method/selected method as a target.
  4. The Properties tab contains all the properties like behavior and spinner behavior. Learn more.
  5. The Data tab contains the fields serving as Input Fields for the API.
  6. The Events tab contains the events that can be configured to trigger any action. Learn more.

Properties

PropertyDescription
Behavior
Update data on input changeIf checked, the component will be triggered automatically on the change of input data (as mentioned in the data tab) for the variable.
Request data on page loadIf checked, 'Page' variable will be triggered on page load while 'Application' variable will be triggered on application load.
In Flight BehaviorThis property determines the behavior when a call is fired through the variable with the previous call still pending. Variable queues all these calls, waits for the previous call completion and then based on the value of the inFlightBehavior property, decides what to do with all the queued calls:

- doNotExecute - all the queued calls will be discarded,
- executeAll - all the calls will be triggered one by one, or
- executeLast - only the last call is triggered and the rest are discarded, this is the default behavior
Spinner
Spinner ContextThis property specifies on which UI widget the spinner should show. Leave empty if no spinner required.
Spinner MessageThe message to be displayed below the spinner. Leave empty if no message is required below the spinner. Note: If multiple variables are fired then the spinner messages will be displayed as a list below a single spinner.

Events

During the life cycle of a Variable, a set of events are emitted by the Variable, thus giving you the option to control the behavior of the Variable such as input data validations, data processing, success/error handling, and more.

  • OnBeforeUpdate
  • OnResult
  • OnError
  • OnBeforeDatasetReady
  • OnCanUpdate
  • OnSuccess

To learn how to implement Events, see Events Documentation.

Methods

Few Methods are exposed for Variables which can be used for achieving more control and accessing extra functionality. Listed here are the same.

invokecancel
getDataclearDatasetInput

invoke()

This method updates the Variable’s dataSet with new data by making a call to the target service.

Parameters

options (object) - It can have fields as

  • inputFields (key-value pair of inputData)
  • page (pagination for Query Service Variable)
  • size (pagination for Query Service Variable)
  • orderBy (pagination for Query Service Variable)

success (callback)

error (callback)

Return Value

none

Example

var sv = Page.Variables.[variable_name];
    sv.invoke({
       "inputFields": {
       "fname": "Steve",
       "lname": "Rogers"
       }
      }, function(data) {
        // Success Callback
        console.log("success", data);
     }, function(error) {
        // Error Callback
        console.log("error", error)
    });

cancel()

This method aborts the current inflight variable request.

Parameters

none

Return Value

none

Example

Page.Variables.[variable_name].cancel();

getData()

This method returns the variable’s dataSet, i.e., the current data stored in the variable through the listrecords method.

Parameters

none

Return Value

Array of record objects

Example

var result = Page.Variables.[variable_name].getData();
console.log("result:", result);
// Output: 
// result: {data in the variable}

clearData()

This method clears the variable dataSet.

Parameters

none

Return Value

Updated(empty) dataSet of the variable

Example

var result = Page.Variables.[variable_name].clearData();
console.log("result:", result);
// Output: 
// result: {}

setInput(key, value)

This method sets the input field value against the specified field(key).

Parameters

  • key(string): name of the input field
  • value(*): value for the input field

Return Value

Updated inputFields object

Example

var sv = Page.Variables.[variable_name];
    sv.setInput("fname", "Peter");
    sv.setInput("lname", "Parker");
    sv.invoke();

setInput(object)

This method can also be used to set all the specified key-value pairs as input fields in the variable.

Parameters

inputData(object) object, or 
key-value pairs {“key”: “value”,…}

Return Value

Updated inputFields object

Example

var sv = Page.Variables.[variable_name];
    sv.setInput({
      "fname": "Peter",
      "lname": "Parker"
     });
    sv.invoke();
Last updated on 7/14/2020 by Swetha Kundaram
← CRUD VariableWebSocket Variable →
  • How to Create a Service Variable
    • Service Variable for Web Services
    • Service Variable for Imported APIs
    • Variable Properties and Events
  • Properties
  • Events
  • Methods
  • invoke()
  • cancel()
  • getData()
  • clearData()
  • setInput(key, value)
  • setInput(object)
WaveMaker
  • PRICING
  • PARTNERS
  • CUSTOMERS
  • ABOUT US
  • CONTACT US
Terms of Use | Copyright © 2013-2023 WaveMaker, Inc. All rights reserved.