FM BetterForms
BF Editorfmbetterforms.com
1.0 dont use
1.0 dont use
  • Introduction
  • Features Summary
  • Getting Started
    • System Overview
    • Integration
      • 1. Configure FileMaker Server
      • 2. Add your Server to BetterForms
      • 3. Introduction to Hooks
      • 4. Create your first Site
      • 5. Create your first Page
      • 6. Configure your FileMaker File(s)
      • 7. Run your first Hook
      • Next Steps
    • Common Customizations
      • Introduction to Actions
      • Introduction to Buttons
      • Page Navigation
      • Displaying Data in a Table
    • Support
      • Hacking a Webpage
      • Learning JSON
  • Reference
    • Site Settings
      • Navigation
      • Slots / Code Injection
      • App Model
      • Site-wide Named Actions
    • Page Settings
      • Data Model
      • Card / Window Modals
      • Validation
        • Custom Validators
      • Misc Page Settings
    • Page Elements
      • Common
        • Button
        • Data Table
        • HTML
      • Grouping Elements
        • Tabs
        • panel
        • accordion
        • listrows
      • Uploading Files
        • dropzone
        • dropzone to S3
        • uploadCare
      • Misc Elements
        • Plain Text / Code Editor
        • signature
        • fullCalendar
        • rangeSlider
      • Payment Gateways
        • Authorize.net
        • PayPal
        • Stripe
      • Adding Custom Page Elements
    • Actions Processor
      • Named Actions
      • Actions
        • runUtilityHook
        • path
        • debounce
        • throttle
        • showAlert
        • showModal / hideModal
        • function
        • clipboard
        • cookie
        • setFocus
        • wait
        • emit
        • validate
        • channelJoinAnon
        • channelLeaveAnon
        • messageSend
        • messageSendAnonChannel
      • Authentication Actions
    • Script Hooks
      • Globals Variables
        • $$BF_Model
        • $$BF_App
        • $$BF_State
      • Keeping Keys Private
      • Reducing Payload Size
      • API Callback Endpoint
      • Common Hooks
      • Scoped Hooks
    • Users & Authentication
      • Managing User Accounts
      • Custom Login Pages
    • Advanced Configuration
      • Custom Domains
    • BF Utility Functions
    • BF Error Codes
    • Messaging
      • Adding users to channels
      • Removing users from channels
      • Sending messages
      • Get connected users
      • Get active channels
  • Usage Tips
    • Troubleshooting
      • Debugging
      • Frozen Actions Queue
    • JavaScript Tips
      • Calling Named Actions from HTML Vue Events
      • Calculations
    • System Overview
    • Forms Processor
      • Form Types
      • HTML & VueJS
      • Styling and Design
      • JS Caclulations and Functions
    • Customizing and Styling
      • Custom Components
      • Custom CSS
      • Custom Components
      • Page Pre-loaders
      • Favicon
    • Design Patterns and Best Practices
      • Working with environments
      • Handling Data
      • Saving Data
      • Optimization
      • Business Logic
      • UI / UX
  • Security
    • Authentication
    • Security White Paper
    • Firewalls
    • Technology Stack
  • Compatibility
Powered by GitBook
On this page

Was this helpful?

  1. Usage Tips
  2. JavaScript Tips

Calculations

Nearly all JSON keys can be replaced with calculations. This is similar to how a field in Filemaker can also be a calculation.

FM BetterForms has three types of calculations, getters and functions. Both types are needed because the framework uses several open source modules internally and not all modules have the same compatibility.

As A Getter

Adding an evaluating calc as a getter will convert your code into a getter property that can be referenced as a regular hard coded attribute.

Syntax: myKey_calc Add a _calc to the key name.

As A Function Getter

Adding an evaluating calc as a function will convert your code into a function and attach it to the referenced key.

Syntax: myKey_calcf Add a _calcf to the key name.

As A Function

Adding an evaluating calc as a function will convert your code into a function and attach it to the referenced key.

Syntax: myKey_function Add a _function to the key name.

Scope

Scope changes when code is evaluated as a getter and is less flexible. Getters generally can only see the object they are part of. (The schema of the element)

Why Two Ways?

Different JavaScript components access different variables in different ways. Some modules will access an attribute as if it was a constant while others will check if it is a function. Functions are called differently than constants.

Example:

// in your schema ...
{
    "color": "blue",
    "visible": model.someField == 0
}
// in the JS module this may be accessed as ...
var theColor = color // blue

// Other modules would reference the attribute as a function ...
var isVisible = visible()  // this is calling the key as a function
PreviousCalling Named Actions from HTML Vue EventsNextSystem Overview

Last updated 3 years ago

Was this helpful?