json-rules-filter 1.0.23 → 1.0.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "json-rules-filter",
-  "version": "1.0.23",
+  "version": "1.0.25",
   "description": "para crear reglas avanzadas de filtrado sobre datasets JSON de forma dinámica y visual.",
   "main": "src/jquery.jsonRulesFilter.js",
   "scripts": {

package/src/jquery.jsonRulesFilter.js

@@ -82,12 +82,36 @@
                     return result;
                 },
 
+                // -------------------- PUBLIC FUNCTIONS ----------//
+
                 // Updates dataset from external source and refreshes the UI
-                updateData: function (newData) {
+                updateData: function (newData, callback) {
                     this.data = newData;
-                    this.reset();
+                    //Run callback del usuario
+                    callback?.();
+                },
+
+                //Set pre-aplicated rules
+                preloadRules(rules) {
+                    const self = this;
+                    $.each(rules, function (clave, valor) {
+                        console.log(valor);
+                        self.addRuleRow(valor.typeFilter, valor.dataField, valor.dataName, valor.optionFilter, valor.searchValue);
+                    });
+                    this.applyRules();
+                },
+
+                // Resets rule container and re-runs filtering (show all)
+                reset: function (callback) {
+                    const rules = this.getAplicatedRules();
+                    $(".container-rules-filters").empty();
+                    this.applyRules();
+                    //Run callback del usuario
+                    callback?.(rules);
                 },
 
+                //--------------------------------------------------//
+
                 // Collects all rules currently defined in the DOM
                 getAplicatedRules: function () {
                     const rules_items = $contenedor.find("select[name=select-rule-option]");
@@ -162,13 +186,15 @@
                     this.$contenedor.append(template);
                     if (this.settings.scrollY !== false) {
                         const maxHeight = typeof this.settings.scrollY === 'number' ?
-                        this.settings.scrollY + 'px' :
-                        this.settings.scrollY;
+                            this.settings.scrollY + 'px' :
+                            this.settings.scrollY;
 
                         this.$contenedor.find(".container-rules-filters").css({
                             "max-height": maxHeight,
                             "overflow-y": "auto",
-                            "overflow-x": "hidden"
+                            "overflow-x": "hidden",
+                            "margin-right": "-10px",
+                            "padding-right": "10px"
                         })
                     }
                 },
@@ -206,8 +232,10 @@
                     // Add new rule row
                     this.$contenedor.find(".dropdown-rules-item").on("click", function (e) {
                         e.preventDefault();
-                        self.addRuleRow($(this).data("column-type"), $(this).data("column-data"), $(this).data("column-name"));
-                        $dropdown.dropdown("hide");
+                        self.addRuleRow($(this).data("column-type"), $(this).data("column-data"), $(this).data("column-name"), "", "");
+                        if (self.settings.bsVersion === 4) {
+                            $dropdown.dropdown("hide");
+                        }
                     });
 
                     // Clear all rules
@@ -223,14 +251,8 @@
                     });
                 },
 
-                // Resets rule container and re-runs filtering (show all)
-                reset: function () {
-                    $(".container-rules-filters").empty();
-                    this.applyRules();
-                },
-
                 // Adds a new rule row dynamically
-                addRuleRow: function (type, dataField, name) {
+                addRuleRow: function (type, dataField, name, selectedValues, searchValue) {
                     const self = this;
                     const $container = this.$contenedor.find(".container-rules-filters");
 
@@ -247,7 +269,7 @@
                     const searchInput = `
                     <div class="col-7">
                         <label class="${labelClass}"><span class="text-danger">*</span>${this.settings.language.searchLabel[type]}</label>
-                        <input type="text" class="form-control" name="input-rule-search" id="input-rule-search-${id_select}">
+                        <input type="text" class="form-control" value="${searchValue}" name="input-rule-search" id="input-rule-search-${id_select}">
                     </div>`;
 
                     const row = `
@@ -269,13 +291,15 @@
                     $container.append(row);
                     // Fetch custom render function from settings
                     const render = self.settings.filters.find((e) => e.data === dataField).render;
-                    this.initSelect2(id_select, type, dataField, render);
+                    // Initialice select2
+                    this.initSelect2(id_select, type, dataField, selectedValues, render);
                 },
 
                 // Initialize Select2 plugin on the newly created dropdown
-                initSelect2: function (id, type, dataField, render) {
+                initSelect2: function (id, type, dataField, selectedValues, render) {
                     const self = this;
                     const $select = this.$contenedor.find(`#select-rule-option-${id}`);
+                    let data = type == 'select' ? this.getSelectValues(dataField, selectedValues) : this.getRuleOptions(type);
 
                     $select.select2({
                         width: '100%',
@@ -284,7 +308,7 @@
                         templateSelection: render,
                         templateResult: render,
                         // Load dataset based on type: unique values for 'select', operators for others
-                        data: type == 'select' ? this.getSelectValues(dataField) : this.getRuleOptions(type)
+                        data: data
                     });
 
                     // Remove rule event
@@ -292,6 +316,9 @@
                         e.preventDefault();
                         $(`#select-rule-container-${id}`).remove();
                     });
+
+                    // Preselected values
+                    $select.val(selectedValues).trigger('change');
                 },
 
                 // Helper to map operator objects from language settings
@@ -303,16 +330,35 @@
                 },
 
                 // Extract unique values from data to populate 'select' type filters
-                getSelectValues: function (dataField) {
+                getSelectValues: function (dataField, selectedValues) {
                     const getValueByPath = (obj, path) => {
                         return path.split('.').reduce((acc, part) => acc && acc[part], obj);
                     };
 
-                    // Using Set + JSON stringify/parse to ensure unique objects in the dropdown
-                    return [...new Set(this.data.map(function (item) {
-                        const val = getValueByPath(item, dataField);
-                        return JSON.stringify({ id: val, text: val });
-                    }))].map((e) => JSON.parse(e));
+                    // 1. Extraemos los valores únicos de la base de datos actual
+                    let uniqueOptions = [...new Set(this.data.map(function (item) {
+                        const val = getValueByPath(item, dataField).toString();
+                        if (val !== undefined && val !== null) {
+                            return JSON.stringify({ id: val, text: val });
+                        }
+                        return null;
+                    }).filter(item => item !== null))].map((e) => JSON.parse(e));
+
+                    // 2. Al ser siempre un array, iteramos directamente si tiene contenido
+                    if (selectedValues && selectedValues.length > 0) {
+                        selectedValues.forEach(val => {
+                            // Si el valor no existe ya en nuestras opciones únicas, lo empujamos
+
+                            if (val && !uniqueOptions.some(opt => opt.id == val)) {
+                                uniqueOptions.push({
+                                    id: val,
+                                    text: val
+                                });
+                            }
+                        });
+                    }
+
+                    return uniqueOptions;
                 },
 
                 // Core filtering engine