Add postcode reset to checkout.

session_dialog.php

@@ -1,7 +1,7 @@
 <?php
 
 session_start();
-function if_needed_place_postcode_form($uri)
+function init_postcode_handlers($uri)
 {
     if (strpos($uri, "/winkel/") !== false) {
         add_action("wp_enqueue_scripts", "modal_styles");
@@ -14,6 +14,8 @@ function if_needed_place_postcode_form($uri)
             render_dialog_html();
         }
     }
+    add_action("wp_footer", "modify_checkout_with_js");
+    add_action("wp_enqueue_scripts", "load_assets_reset_postcode_on_checkout");
 }
 
 function modal_styles()
@@ -116,7 +118,7 @@ function render_dialog_html()
                     <input type="text" name="huisnummer"
                         pattern="/\d+([-\\s]?[a-zA-Z]+)?/"
                         title="Voer een geldig huisnummer in (bijv. 1, 1A, 1-A, 1a)."
-                        placeholder= "12a"
+                        placeholder= "12A"
                         size="5"
                         required
                     />
@@ -278,3 +280,98 @@ function postcode_in_range($postcode, $start, $end)
 
     return $numberPart >= $start && $numberPart <= $end;
 }
+
+function modify_checkout_with_js()
+{
+    if (
+        !is_checkout() ||
+        (is_wc_endpoint_url() && !is_wc_endpoint_url("order-received"))
+    ) {
+        return;
+    }
+
+    $woonplaats = $_SESSION["woonplaats"];
+    $postcode = $formatted_postcode = preg_replace(
+        "/(\d+)([A-Z]+)/",
+        '$1 $2',
+        strtoupper($_SESSION["postcode"]),
+    );
+    $address =
+        $_SESSION["straatnaam"] . " " . strtoupper($_SESSION["huisnummer"]);
+    // Output the JavaScript
+    ?>
+        <script type="text/javascript" id="fill_address_fields">
+          jQuery(document).ready(function($) {
+              fillCheckoutFields();
+              $(document.body).on('updated_checkout', fillCheckoutFields);
+          });
+
+          function fillCheckoutFields() {
+            if (typeof wp !== 'undefined' && wp.data && wp.data.dispatch) {
+              const store = 'wc/store/cart';
+
+              wp.data.dispatch(store).setShippingAddress({
+                  first_name: '',
+                  last_name: '',
+                  address_1: '<?php echo esc_js($address); ?>',
+                  address_2: '',
+                  city: '<?php echo esc_js($woonplaats); ?>',
+                  state: '',
+                  postcode: '<?php echo esc_js($postcode); ?>',
+                  country: 'NL',
+                  phone: '',
+                  email: ''
+              });
+
+              //make fields READONLY and ppstcode reset.
+              setTimeout(() => {
+                // make prefilled fiields readonly.
+                $('#shipping-postcode, #shipping-city, #shipping-address_1')
+                  .prop('readonly', true)
+                  .css('background', '#f9f9f9');
+
+                  // create postcode reset button
+                  const div = document.createElement("div");
+                  const script = document.createElement('script');
+                  div.setAttribute("class", "postcode-reset")
+                  div.innerHTML = `
+                    <a class="reset-postcode-show-comfirm" >Reset postcode.</a>
+                    <span class="bevestiging"> Weet je het zeker?
+                      <a class="accept">ja</a>/<a class="decline">nee</a>
+                      (Deze handeling leegt de winkelwagen.)
+                    </span> `;
+                  div.style.width = "100%";
+                  document.querySelector(".wc-block-components-address-form__city").after(div);
+              }, 500);
+
+
+
+              jQuery(document.body).trigger('update_checkout');
+          } else {
+              console.error('WooCommerce Blocks API is niet beschikbaar');
+          }
+       }
+     </script>
+     <?php
+}
+
+function load_assets_reset_postcode_on_checkout()
+{
+    // Only load on checkout page
+    if (is_checkout() && !is_wc_endpoint_url()) {
+        wp_enqueue_style(
+            "my-checkout-style",
+            plugin_dir_url(__FILE__) . "assets/reset-postcode.css", // Path to your CSS file
+            [],
+            "1.0.0",
+        );
+
+        wp_enqueue_script(
+            "my-checkout-script",
+            plugin_dir_url(__FILE__) . "assets/reset-postcode.js",
+            [], // Dependency on jQuery
+            "1.0.0",
+            true, // Load in footer
+        );
+    }
+}