Fix error getting parameter in front-end

hardingadonis · Mar 6, 2024 · 5805ef5 · 5805ef5
1 parent 5483afb
commit 5805ef5
Show file tree

Hide file tree

Showing 2 changed files with 58 additions and 14 deletions.
diff --git a/src/main/webapp/view/jsp/management/order/add-order.jsp b/src/main/webapp/view/jsp/management/order/add-order.jsp
@@ -177,6 +177,19 @@
                             { label: "${customer.name}", value: "${customer.ID}" },
                         </c:forEach>
                     ];
+                    
+                    customerNameInput.on('input', function () {
+                        var inputText = $(this).val().trim().toLowerCase();
+                        var matchedCustomer = customers.find(function (customer) {
+                            return customer.label.toLowerCase() === inputText;
+                        });
+
+                        if (matchedCustomer) {
+                            customerIdInput.val(matchedCustomer.value); 
+                        } else {
+                            customerIdInput.val(''); 
+                        }
+                    });
 
                     customerNameInput.autocomplete({
                         source: function (request, response) {

diff --git a/src/main/webapp/view/jsp/management/order/add-product-into-order.jsp b/src/main/webapp/view/jsp/management/order/add-product-into-order.jsp
@@ -22,7 +22,7 @@
 
     </head>
 
-    <body id="page-top">
+    <body id="page-top" class="d-flex flex-column min-vh-100">
         <div id="wrapper">
             <%@include file="../../../common/_sidenav.jsp" %>
             <div class="d-flex flex-column" id="content-wrapper">
@@ -123,28 +123,59 @@
             <!--Danh sach goi y-->
             <script>
                 $(document).ready(function () {
-                    var availableProducts = [
+                    var productsArray = [
                         <c:forEach var="product" items="${requestScope.products}">
-                            "${product.name}",
+                            { name: "${product.name}", ID: "${product.ID}", price: "${product.price}" },
                         </c:forEach>
                     ];
+
                     $("#product-name").autocomplete({
-                        source: availableProducts,
-                        select: function( event, ui ) {
-                            var selectedProduct = ui.item.value;
-                            <c:forEach var="product" items="${requestScope.products}">
-                                if("${product.name}" === selectedProduct) {
-                                    $('#product-id').val("${product.ID}");
-                                    $('#product-price').val(formatCurrency("${product.price}"));
-                                    $('#product-quantity').val(1);
-                                }
-                            </c:forEach>
-                            calculateTotal();
+                        source: function(request, response) {
+                            var term = request.term.toLowerCase();
+                            var filteredProducts = productsArray.filter(function(product) {
+                                return product.name.toLowerCase().includes(term);
+                            });
+                            response(filteredProducts.map(function(product) {
+                                return product.name;
+                            }));
+                        },
+                        select: function (event, ui) {
+                            var selectedProductName = ui.item.value;
+                            var selectedProduct = findProductByName(selectedProductName);
+                            if (selectedProduct) {
+                                $('#product-id').val(selectedProduct.ID);
+                                $('#product-price').val(formatCurrency(selectedProduct.price));
+                                $('#product-quantity').val(1);
+                                calculateTotal();
+                            }
+                        },
+                        change: function (event, ui) {
+                            var enteredProductName = $(this).val();
+                            var enteredProduct = findProductByName(enteredProductName);
+
+                            if (enteredProduct) {
+                                $('#product-id').val(enteredProduct.ID);
+                                $('#product-price').val(formatCurrency(enteredProduct.price));
+                                $('#product-quantity').val(1);
+                                calculateTotal();
+                            } else {
+                                $('#product-id').val('');
+                                $('#product-price').val('');
+                                $('#product-quantity').val('');
+                                $('#product-total-price').val('');
+                            }
                         }
                     });
+
+                    function findProductByName(productName) {
+                        return productsArray.find(function(product) {
+                            return product.name === productName;
+                        });
+                    }
                 });
             </script>
 
+
             <!--Validate input-->
             <script>
                 //Validate form add product into order