added select 2 on capitolato

public/userarea/modal_parts.php

@@ -307,4 +307,23 @@
         width: 250px !important;
         min-width: 250px !important;
     }
+
+    #partsTableBody .extra-field-td .select2-container {
+        width: 100% !important;
+        min-width: 180px !important;
+    }
+
+    #partsTableBody .extra-field-td .select2-selection--single {
+        height: 31px !important;
+        padding: 0.15rem 0.35rem !important;
+        border: 1px solid #ced4da !important;
+    }
+
+    #partsTableBody .extra-field-td .select2-selection__rendered {
+        line-height: 28px !important;
+    }
+
+    #partsTableBody .extra-field-td .select2-selection__arrow {
+        height: 29px !important;
+    }
 </style>

public/userarea/partsTable.js

@@ -136,6 +136,50 @@ $(document).ready(function () {
             </td>`;
     }
 
+    function initializeExtraFieldSelect2($context) {
+        if (typeof $.fn.select2 === "undefined") return;
+
+        $context.find(".part-extra-select").each(function () {
+            const $select = $(this);
+
+            if ($select.hasClass("select2-hidden-accessible")) {
+                $select.select2("destroy");
+            }
+
+            $select.select2({
+                placeholder: "Seleziona...",
+                allowClear: true,
+                width: "100%",
+                dropdownParent: $("#partsModal"),
+                minimumResultsForSearch: 0,
+                sorter: function (data) {
+                    return data.sort(function (a, b) {
+                        const textA = (a.text || "").toLowerCase();
+                        const textB = (b.text || "").toLowerCase();
+                        return textA.localeCompare(textB, "it", {
+                            sensitivity: "base",
+                            numeric: true,
+                        });
+                    });
+                },
+                matcher: function (params, data) {
+                    if ($.trim(params.term) === "") return data;
+                    if (typeof data.text === "undefined") return null;
+
+                    const term = params.term.toLowerCase();
+                    const text = data.text.toLowerCase();
+
+                    return text.indexOf(term) > -1 ? data : null;
+                },
+            });
+
+            const selected = ($select.attr("data-selected") || "").toString();
+            if (selected) {
+                $select.val(selected).trigger("change.select2");
+            }
+        });
+    }
+
     $(document).on("change", ".part-extra-select", function () {
         const valId = $(this).val() || "";
         const $row = $(this).closest("tr");
@@ -173,13 +217,14 @@ $(document).ready(function () {
             const $row = $(this);
             $row.find("td:last").before(buildExtraFieldCellHtml($row));
 
-            // ripristina selezione se già presente nello stato riga
             const selected = ($row.data("extra-value-id") || "").toString();
             if (selected) {
                 $row.find(".part-extra-value-id").val(selected);
-                $row.find(".part-extra-select").val(selected);
+                $row.find(".part-extra-select").attr("data-selected", selected);
             }
         });
+
+        initializeExtraFieldSelect2($("#partsTableBody"));
     }
 
     function setPartId($row, id) {
@@ -911,9 +956,13 @@ $(document).ready(function () {
                 </td>
             </tr>`;
         $("#partsTableBody").append(newRow);
-        const $select = $("#partsTableBody tr:last .part-matrice");
+        const $newRow = $("#partsTableBody tr:last");
+        const $select = $newRow.find(".part-matrice");
         const selectedMacro = $("#macro-matrice-filter").val() || "";
+
         initializeSelect2($select, nextPartNumber, "", null, selectedMacro);
+        initializeExtraFieldSelect2($newRow);
+
         updateRowButtons();
         markUnsaved();
     }
@@ -1416,8 +1465,14 @@ $(document).ready(function () {
                             const vid = String(part.extra_value_id);
                             $row.data("extra-value-id", vid);
                             $row.find(".part-extra-value-id").val(vid);
-                            $row.find(".part-extra-select").val(vid);
+                            $row.find(".part-extra-select").attr(
+                                "data-selected",
+                                vid,
+                            );
                         }
+
+                        initializeExtraFieldSelect2($row);
+
                         const $select = $("#partsTableBody").find(
                             `tr[data-part-id="${part.id}"] .part-matrice`,
                         );