Vueform Builder

Expressions can use built-in functions and constants to perform complex calculations and data retrieval within the builder.

Mathematical Functions

• SUM(val, [val2, ...]): Returns the sum of numbers or lists.
• AVG(val, [val2, ...]): Returns the arithmetic mean.
• MIN(val, [val2, ...]): Returns the minimum value.
• MAX(val, [val2, ...]): Returns the maximum value.
• COUNT(val, [val2, ...]): Counts items in a value or array.
• ROUND(number, [decimals]): Rounds to the nearest integer or specified decimal places (default 0).

Date and Time Functions

• TODAY(): Returns the current date.
• NOW(): Returns the current time in ISO8601 format.
• AGE(date): Calculates age in years from a date string or value.
• DATE_ADD(date, amount, interval): Adds/subtracts time. Intervals: seconds, minutes, hours, days, months, years.
• FORMAT_DATE(date, format): Converts a date string/number to a specific format.

Data and Utility Functions

• EMPTY(val): Returns true if the value is empty (empty string, empty array, null, or undefined).
• NOT_EMPTY(val): Returns true if the value contains data.
• DISPLAY_VALUE(ref, 'full_path'): Returns the display label for a field (e.g., Select, Checkbox).
• AVAILABLE('full_path'): Returns true if an element is available (all conditions met).

Constants

• PI: The value of Pi.
• E: Euler's number.

Vueform Builder supports expressions to dynamically calculate values or evaluate conditions. Expressions are wrapped in curly braces {} for values or used directly in condition builders.

Syntax Patterns

• Standard Values: Use {expression} to inject a calculated value. Example: Hi, {first_name}!
• Math Expressions: Use ${expression} for mathematical calculations. Example: ${price * qty}
• Data Paths: Access nested data using dot notation: {container.field_name}.
• Arrays: Access array elements by index: {list.0}.
• Siblings: In nested lists, access sibling elements using the wildcard: {list.*.sibling}.
• Escaping: To use literal curly brackets, escape them with backslashes: \{first_name\}.

Common Operators

• Arithmetic: +, -, *, /, % (remainder), ^ (power), ! (factorial).
• Comparison: ==, !=, >=, <=, >, <.
• Logical: and, or, not (or NOT()), and grouping with ().
• Membership: in (checks if a value exists in an array or object).

// Value expression
"value": "Hi, {first_name}!"

// Math expression
"value": "${price * qty}"

// Condition expression
"condition": "age > 18 and terms_accepted == 1"

When writing expressions in Vueform Builder, use the following syntax patterns to access different types of data:

• Literal Braces: Use {} to wrap expressions. Example: {namae}
• Escaped Braces: To use literal braces in a string, use \{ and \}. Example: \{namae\}
• Nested Elements (Data Path): Access nested data using dot notation. Example: {container.field_name}
• Arrays: Access specific array indices. Example: {list.0}
• Sibling Elements: Access siblings within a nested list using the wildcard *. Example: {list.*.sibling}
• Math Expressions: Use ${} for math-specific contexts. Example: ${kakaku * suryo}
• Full Paths: For functions like AVAILABLE or DISPLAY_VALUE, use the full field path wrapped in single quotes. Example: AVAILABLE('container.select') (Note: sibling paths like 'list.*.select' are not supported for these specific functions).

The Hungarian locale defines the documentation and examples for the expression language used in Vueform Builder.

Mathematical Operators

• + (Plus): Adds two numbers. Example: {reszosszeg + ado}
• - (Minus): Subtracts the right operand from the left. Example: {osszesen - kedvezmeny}
• * (Times): Multiplies two numbers. Example: {ar * mennyiseg}
• / (Divide): Divides the left operand by the right. Example: {osszesen / darabszam}
• % (Remainder): Returns the remainder of division. Example: {darabszam % 2}
• ^ (Power): Raises the left operand to the power of the right. Example: {alap ^ kitevo}
• ! (Factorial): Calculates the factorial. Example: {5!}

Comparison Operators

• == (Equal): Checks if values are equal. Example: {kategoria == 'fo'}
• != (Not equal): Checks if values are not equal. Example: {kategoria != 'fo'}
• >= (Greater than or equal): Example: {ar >= 100}
• <= (Less than or equal): Example: {ar <= 100}
• > (Greater than): Example: {ar > 100}
• < (Less than): Example: {ar < 100}
• in: Checks if a value exists in an array or object. Example: {'adminisztrator' in szerepkorok}

Logical Operators

• and: Returns true if both expressions are true. Example: {aktiv and ellenorzott}
• or: Returns true if at least one expression is true. Example: {adminisztrator or moderator}

Built-in Functions

• NOT(value): Returns the logical opposite.
• EMPTY(value): Returns true if the value is empty (empty string, empty array, null, or undefined).
• NOT_EMPTY(value): Returns true if the value is not empty.
• SUM(val1, [val2, ...]): Returns the sum of numbers or lists.
• AVG(val1, [val2, ...]): Returns the average of numbers or lists.
• MIN(val1, [val2, ...]): Returns the smallest value.
• MAX(val1, [val2, ...]): Returns the largest value.
• ROUND(number, [decimals]): Rounds a number to the nearest integer or specified decimal places.
• COUNT(val1, [val2, ...]): Counts the number of values or elements in an array.
• AGE(date): Calculates age in years from a birth date.
• TODAY(): Returns the current date.
• NOW(): Returns the current time in ISO8601 format.
• DATE_ADD(date, amount, interval): Adds or subtracts an interval (e.g., napok, honapok, evek) from a date.
• FORMAT_DATE(value, format): Formats a date string or number.
• DISPLAY_VALUE(element, 'full_path'): Returns the display label of a value from a field like a select or checkbox.
• AVAILABLE('full_path'): Returns true if an element is available (all conditions met).

Vueform Builder expressions support a variety of mathematical and logical operators to evaluate field values and control form behavior.

Mathematical Operators

• + (Addition): {shokei + zei}
• - (Subtraction): {gokei - waribiki}
• * (Multiplication): {kakaku * suryo}
• / (Division): {gokei / kosu}
• % (Remainder): {kosu % 2}
• ^ (Power): {kisu ^ shisu}
• ! (Factorial): {5!}

Comparison Operators

• == (Equal): {category == 'main'}
• != (Not Equal): {category != 'main'}
• >= (Greater than or equal): {kakaku >= 100}
• <= (Less than or equal): {kakaku <= 100}
• > (Greater than): {kakaku > 100}
• < (Less than): {kakaku < 100}
• in (In array/object): {'admin' in roles}

Logical Operators

• and: Returns true if both expressions are true. Example: {is_active and is_verified}
• or: Returns true if at least one expression is true. Example: {is_admin or is_moderator}
• NOT(): Returns the logical opposite. Example: NOT(true) returns false.