Skip to content

Releases: deirvlon/select-relations

Select Relations JS v2.0.0

07 Oct 20:49
@deirvlon deirvlon
v2.0.0
6c83b5e
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode.

Choose a tag to compare

View all tags
Select Relations JS v2.0.0 Latest
Latest

Release Notes

Version 2.0.0 - Major Feature Release

Release Date: October 8, 2025
Author: Kamran Gasimov
Company: Deirvlon Technologies

🎉 Overview

Select Relations JS v2.0.0 represents a major milestone in the library's evolution. This release introduces powerful new logical operators and expression evaluation capabilities while maintaining 100% backward compatibility with all v1.x implementations.

⭐ What's New

1. OR Logic Operator (|)

You can now create conditions where any one of multiple criteria can be met, not just all of them.

Syntax:

<option data-pr="country:usa|country:canada">Available in USA or Canada</option>

Use Cases:

  • Products available in multiple regions
  • Features accessible to multiple user types
  • Services offered across different categories

Example:

<select id="service" data-sf-parent="region">
  <option value="express" data-pr="region:north|region:south">
    Express Delivery (North or South regions)
  </option>
  <option value="premium" data-pr="region:north|region:south|region:east">
    Premium Service (Available in 3 regions)
  </option>
</select>

2. Parenthesis Grouping (())

Build complex nested conditions with explicit control over evaluation order.

Syntax:

<option data-pr="(country:usa&state:ca)|(country:canada&province:on)">
  Complex Condition
</option>

Use Cases:

  • Multi-criteria product filtering
  • Complex business rules
  • Conditional feature availability
  • Premium membership overrides

Example:

<select id="shipping" data-sf-parent="country,membership">
  <option value="overnight" data-pr="(country:usa&membership:premium)|country:canada">
    Overnight (Premium USA members or all Canada)
  </option>
</select>

3. Enhanced Expression Evaluator

Complete rewrite of the condition evaluation engine with:

  • Recursive parenthesis resolution - Handles nested grouping to any depth
  • Proper operator precedence - AND before OR, like standard logic
  • Optimized parsing - Faster evaluation of complex conditions
  • Better error handling - Gracefully handles malformed expressions

Operator Precedence:

  1. () Parentheses (highest priority)
  2. & AND operator
  3. | OR operator (lowest priority)

4. Improved Code Architecture

Refactored Functions:

  • evaluateRelation() - Main entry point for condition evaluation
  • evaluateSimpleExpression() - Handles OR/AND logic without parentheses
  • evaluateCondition() - Evaluates single conditions (selectId:values)

Benefits:

  • More maintainable codebase
  • Easier to extend with new features
  • Better performance on complex expressions
  • Clearer separation of concerns

🔄 Breaking Changes

None! Version 2.0.0 is 100% backward compatible with v1.x.

All existing implementations will continue to work without any modifications. The new features are purely additive.

📊 Comparison: v1.x vs v2.0.0

Feature v1.1.4 v2.0.0
AND Logic (&) ✅ ✅
OR Logic (|) ❌ ✅
Parenthesis Grouping ❌ ✅
Multiple Values ✅ ✅
Checkbox Support ✅ ✅
Multi-Parent ✅ ✅
Select2 Integration ✅ ✅
Auto-Reset ✅ ✅
Operator Precedence N/A ✅
Nested Conditions ❌ ✅

💡 Usage Examples

Simple OR

<!-- v1.x: Not possible -->
<!-- v2.0.0: Easy! -->
<option data-pr="category:electronics|category:computers">
  Available in Electronics or Computers
</option>

Complex Business Logic

<!-- v1.x: Would require multiple options or JavaScript -->
<!-- v2.0.0: Single elegant condition -->
<option data-pr="(status:active&plan:premium)|(status:trial&feature:enabled)">
  Premium features or trial with feature flag
</option>

Mixed AND/OR Logic

<!-- v1.x: Not possible -->
<!-- v2.0.0: Intuitive syntax -->
<option data-pr="country:usa&(state:ca|state:ny|state:tx)">
  USA only, but available in CA, NY, or TX
</option>

Premium Override Pattern

<!-- v1.x: Would need separate options -->
<!-- v2.0.0: Single condition with override -->
<option data-pr="(country:usa&subscription:basic)|membership:premium">
  USA Basic subscribers OR any Premium member
</option>

🚀 Performance Improvements

  • 30% faster evaluation of simple conditions
  • Optimized recursive parsing for complex expressions
  • Reduced DOM queries through better caching
  • Smarter update logic prevents unnecessary re-evaluations

🐛 Bug Fixes

Fixed in v2.0.0:

  1. Issue #47: Reset function now properly handles Select2 elements with null values
  2. Issue #52: Improved handling of undefined parent elements
  3. Issue #58: Better whitespace handling in condition strings
  4. Issue #63: Fixed edge case where disabled options weren't properly hidden
  5. Performance: Reduced redundant filtering on cold start

🔧 Technical Changes

New Functions:

evaluateRelation(relationData)           // Main evaluator with parenthesis support
evaluateSimpleExpression(expression)     // Handles AND/OR without parentheses
evaluateCondition(condition)             // Evaluates single condition

Modified Functions:

updateFiltering(select, restart)         // Now uses evaluateRelation()

Unchanged Functions:

initializeFiltering()                    // No changes
resetParentSelects()                     // No changes

📦 Migration Guide

From v1.1.4 to v2.0.0

Step 1: Update the script source

<!-- Old -->
<script src="select-relations-v1.1.4.js"></script>

<!-- New -->

<script src="select-relations-v2.0.0.js"></script>

Step 2: Test your existing implementation

  • All v1.x syntax continues to work
  • No code changes required

Step 3: (Optional) Enhance with new features

  • Add OR logic where applicable
  • Use grouping for complex conditions
  • Simplify multiple similar options

Example Migration:

Before (v1.x):

<option data-pr="country:usa&state:ca">California</option>
<option data-pr="country:usa&state:ny">New York</option>
<option data-pr="country:canada&province:on">Ontario</option>

After (v2.0.0) - Consolidated:

<option data-pr="(country:usa&state:ca)|(country:usa&state:ny)|(country:canada&province:on)">
  Available Regions
</option>

Or even better:

<option data-pr="country:usa&(state:ca|state:ny)|country:canada&province:on">
  Available Regions
</option>

🎯 Use Case Scenarios

E-commerce

<!-- Dynamic shipping based on location and membership -->
<option data-pr="(country:usa&weight:0,5)|(membership:premium&weight:0,10)">
  Free Shipping
</option>

SaaS Platforms

<!-- Feature availability based on plan or trial status -->
<option data-pr="(plan:pro|plan:enterprise)|(trial:active&feature_flag:enabled)">
  Advanced Analytics
</option>

Multi-Region Applications

<!-- Services available in specific region combinations -->
<option data-pr="(region:eu&gdpr:compliant)|(region:us&ccpa:compliant)">
  Data Processing Service
</option>

Configuration Wizards

<!-- Complex product configurations -->
<option data-pr="(type:laptop&brand:apple)|(type:desktop&brand:dell|brand:hp)">
  Windows Compatible Software
</option>

📚 Documentation Updates

  • NEW: Comprehensive syntax guide for OR and grouping
  • NEW: 15+ real-wo...
Read more
Assets 3
Loading