Code Effects Client-Side API
Package
codeeffects - npm
Files
- codeeffects.editor.js
- codeeffects.common.css
- codeeffects.light.css
Remarks
The Code Effects Rule Editor provides a powerful, modular client-side interface that integrates seamlessly with any modern web application. It enables users to visually create, edit, and manage business rules directly in the browser, while your server-side code handles rule evaluation through the Code Effects Rule Engine.
The editor is implemented as a self-contained JavaScript library that exposes a compact set of public functions via two global variables — $rule and $ce — while encapsulating all other logic within its internal scope. This makes it completely safe to add the editor to any environment without risking conflicts with existing scripts, frameworks, or global objects.
Starting with script's version 6.1.5, the editor has been modularized to support both modern frameworks and traditional web applications:
- It can be imported as an ES module in client frameworks such as React, Angular, or Vue.
- It can also be referenced as a plain script in any HTML markup using the
<script type="module"> tag.
- The editor’s package is distributed through npm under the package name
codeeffects, making it easy to integrate into any build pipeline.
The editor includes two CSS files:
codeeffects.common.css — the core stylesheet shared across all themescodeeffects.light.css — the new default Light theme (a Dark theme will be introduced in a future release)
The Rule Editor is fully self-contained and has no dependencies on third-party client or server libraries. It supports all current versions of all major browsers.
Refer to our demo projects for examples of referencing, configuring, and using the editor across different .NET web platforms.
Global Shortcuts
$rule
Type: (Object) - The CodeEffects.Rule.Models namespace
This global shortcut is declared to make the footprint of CodeEffects namespace smaller.
$ce(..)
Returns: (Object) - Instance of the Rule Editor
This is a global shortcut to the $rule.Context.getControl(..) function that can be used to get an instance of a Rule Editor by the client id of its hosting div element.
Parameters
- id (
String) - Client id of the hosting div element of Rule Editor. Required.
Example
var codeeffects = $ce("divRuleEditor");
Global Functions
Public Event Handlers
onBlur(..)
Returns: (undefined)
Gets invoked when the Rule Area loses focus (i.e., when the user first clicks or taps on any DOM element in the current document that is not a child node of the main div container of the Rule Area while it is focused). Subscribe to the onblur event of the Rule Area by calling this handler and passing a callback function as its only parameter. Unsubscribe by calling this handler without any parameters or by passing null as its only parameter.
Parameters
- callback (
Function) - A callback function that the editor calls when the Rule Area loses focus. The editor passes no parameters to the callback.
Example
var editor = $ce("divEditor");
editor.onBlur(function() { alert("The onBlur event is handled"); });
onFocus(..)
Returns: (undefined)
Gets invoked when the Rule Area receives focus (i.e., when the user first clicks or taps on any child node of the main div container of the Rule Area while it is not focused). Subscribe to the onfocus event of the Rule Area by calling this handler and passing a callback function as its only parameter. Unsubscribe by calling this handler without any parameters or by passing null as its only parameter.
Parameters
- callback (
Function) - A callback function invoked when the Rule Area loses focus. The editor passes a reference to the event.target element that was clicked or tapped within the Rule Area.
Example
var editor = $ce("divEditor");
editor.onFocus( function (el) { alert("The onFocus event is handled. Target element: " + el.id); } );
Public Instance Functions
clear()
Returns: (Object) - Rule Editor instance
Removes all elements of the current rule from the Rule Area.
Parameters
deleted(..)
Returns: (Object) - Rule Editor instance
Calling this function after deleting a rule is necessary to clear editor's cache and remove the deleted rule from the Rules menu (if the Toolbar is displayed) and context menus.
Parameters
- id (
String) - ID of the rule that is being deleted. This parameter is required.
disable()
Returns: (Object) - Rule Editor instance
Prevents users from adding new rules or modifying the rule currently loaded in the Rule Area.
Parameters
var editor = $ce("divEditor");
editor.disable();
dispose()
Returns: (Object) - Rule Editor instance
Disposes all resources used by Rule Editor and removes it from the current context.
Parameters
enable()
Returns: (Object) - Rule Editor instance
Restores ability to add new rules or modify the rule currently loaded in the Rule Area.
Parameters
extract()
Returns: (String) - JSON string
Returns a JSON string containing the current rule and a value indicating whether it is valid. If the Rule Area is empty, returns an empty JSON.
Parameters
isAltered()
Returns: (Boolean)
Returns true if the user has modified an existing rule after it was loaded into the Rule Area or a new rule after its creation was initiated. Otherwise, returns false.
Parameters
isEmpty(..)
Returns: (Boolean)
Returns true if the Rule Area currently contains no rule elements. Otherwise, returns false.
Parameters
- includeFormattingElements (
Boolean) - Indicates whether formatting elements of the rule, such as tabs and new lines, should be counted. Optional. Default value is true.
isEvaluationType()
Returns: (Boolean)
Returns true if the loaded rule is of the evaluation type or if the rule author selected the New evaluation-type rule option from the Rules menu of the Toolbar. This function does not check which rule elements the author has added to the Rule Area so far.
Parameters
getRuleId()
Returns: (String) - String value of the Rule ID (.NET System.Guid)
Returns the string ID of the current rule assigned by the Rule Editor. The editor generates new rule IDs by calling .NET’s System.Guid.NewGuid().ToString(). Returns null if no rules have been loaded into the editor, if the current rule has not yet been assigned an ID, or if the Rule Area is empty.
Parameters
loadInvalids(..)
Returns: (Object) – Rule Editor instance
Call this function to load invalid rule elements into the Rule Editor.
Parameters
- data (
String) - JSON string received from the GetClientInvalidData() method of the CodeEffects.Rule.Editor.Control .NET class. Download the related demo project to see how to load invalid rule data into the Rule Editor. This parameter is required.
loadRule(..)
Returns: (Object) – Rule Editor instance
Call this function to load a rule into the Rule Editor.
Parameters
loadSettings(..)
Returns: (Object) – Rule Editor instance
Call this function to load the Rule Editor client settings. You should also call it whenever the rule author changes any of the editor’s settings, such as the visibility of the Toolbar, Help String, and similar options.
Parameters
saved(..)
Returns: (Object) – Rule Editor instance
Call this function after saving a new rule or updating an existing one to refresh the Rules menu of the Toolbar and context menus of the editor with the new or updated values.
Parameters
- id (
String) - ID of the rule that has been saved or updated. This parameter is required for new rules and optional for updates.
setClientActions(..)
Returns: (Object) – Rule Editor instance
Call this function during page initialization to specify which functions the Rule Editor should call when the rule author wants to load, delete, or save a rule. Do not call it if the Toolbar is disabled.
Parameters
- loadCallback (
Function) - Callback function that handles loading a rule. This function must declare a single parameter of type string. The Rule Editor calls this function and passes it the rule ID when the rule author selects that rule from the Toolbar’s Rules menu. This parameter is required.
- deleteCallback (
Function) - Callback function that handles deleting a rule. This function must declare a single parameter of type string. The Rule Editor calls this function and passes it the rule ID when the rule author clicks the Delete button on the Toolbar. This parameter is required.
- saveCallback (
Function) - Callback function that handles saving a rule. This function must declare a single parameter of type object. The Rule Editor calls this function and passes it an object containing the rule data when the rule author clicks the Save button on the Toolbar. This callback works in tandem with the LoadClientData() method of the CodeEffects.Rule.Editor.Control .NET class. This parameter is required.