WireBootstrap
HomeDocsBuySupport
  • Introduction
  • Overview
  • Getting Started
  • Installation
  • Connecting to Data
    • Data Connectors
      • SQL Data
      • Custom Web Services
      • Local Data
      • Other Sources
    • Data Sources
    • Discovery
    • Building a Data Connector
  • Working With Queries
    • Select Queries
      • Query Extensions
    • Stored Procedures
    • Custom Web Services
    • Executing Queries
    • ORM
  • Writing Data
  • Updates
  • Deletes
  • Working with DataTables
    • Introduction
    • Filter and Sort
    • Select and Calculate
    • Joins
    • Rows
    • Columns
  • Working with DataSets
  • Introduction
  • Executing Queries
  • Transforms
  • Writing Data
  • Data Events
  • Working with Components
    • Introduction
    • Encapsulation
    • Configuration
      • Data
      • Events
      • Observables
      • Validation
      • Display
      • Vendor
      • Custom
    • Component
    • Web Frameworks
    • Building a Component
      • Hello World
      • Data Events
      • DataSets
  • Working With Data Events
    • Introduction
    • Event Basics
    • Event Data
    • Event Actions
  • Working with Themes
    • Introduction
    • Sample Data
    • Libraries
    • Pages
    • Building a Theme Project
  • Utilities
    • Formatting
    • Expressions
    • Collections
    • Spinners
    • Copy and Merge
    • Validation
    • Loading Assets
    • Service Calls
    • Download Files
    • Browser Location
    • Types
    • Promise
  • Reference
    • wire
      • wire.Collection
      • wire.download
      • wire.validate
    • wire.data
      • wire.data.DataEvent
      • wire.data.DataModel
      • wire.data.DataPromise
      • wire.data.DataSet
      • wire.data.DataSource
      • wire.data.DataTable
        • Columns
        • Rows
      • wire.data.StoredProcedure
      • wire.data.TableQuery
    • wire.ui
      • wire.ui.Component
      • wire.ui.validate
Powered by GitBook
On this page
  • Standard Actions
  • Custom Actions

Was this helpful?

  1. Working With Data Events

Event Actions

Event actions allow event providers to specify the intent of the operation for which the event is being raised. This can be picked up by consumers of the event and processed accordingly.

Standard Actions

Standard actions in the WireBootstrap data event system are centered around keeping data selections in sync among the components displaying data on a page.

In the example below, the event is telling consumers that the product SKU001 was selected and should replace the product value in any data set or query on the page.

const dataevent = new wire.data.DataEvent()
    .dataselect()
    .action().replace()
    .cell("product", "SKU001")
    .raise();

With standard data events, replace is the default action. If no action is specified, consumers should consider the data event a replace action.

Other standard actions include add which tells consumers to add the cell value to a query or data set, remove which will remove the cell value from a dataset or query, and clear which clears the selections all together for the column, product in this example.

...

ev.action().add();
 
ev.action().remove();
 
ev.action().clear();      

...

Custom Actions

In the example below, an event is raised telling listeners that data has been selected and that the data should be passed to an external system via a custom link. Consumers of this event would need to be programmed to process the link based on the data and the action

const dataevent = new wire.data.DataEvent()
    .dataselect()
    .action("link")
    .data( { url: "https://somesite?product=SKU001" } )
    .raise();
PreviousEvent DataNextIntroduction

Last updated 3 years ago

Was this helpful?