Lookup field with yee addons elementor INPUT MASK for postcode uk, then using the lookup against a API postcodes.io or OSM or custom api, determine the region, then update the region and 2more fields

elementor-uk-postcode-lookup-set-region.js

	jQuery(document).ready(function ($) {
  /* ------------------------------------------------------------------ */
  /* 1️⃣  Grab the postcode field and the region dropdown */
  /* ------------------------------------------------------------------ */
  var $zipInput     = $('#form-field-zip'); // postcode field
  var $regionSelect = $('#form-field-uk_region'); // region field to set

  /* ------------------------------------------------------------------ */
  /* 2️⃣  Find the reference point – the last hidden field in the form */
  /* ------------------------------------------------------------------ */
  var $lastHidden = $('div.elementor-field-group-pageUri'); // just to add the extra hidden fields after the last div

  /* ------------------------------------------------------------------ */
  /* 3️⃣  Helper: create a hidden field with its wrapper */
  /* ------------------------------------------------------------------ */
  function createHiddenField(id, name, label) {
    var $wrapper = $('<div>', {
      class: 'elementor-field-type-hidden elementor-field-group elementor-column elementor-field-group-' + label + ' elementor-col-100'
    });

    var $input = $('<input>', {
      type:      'hidden',
      id:        id,
      name:      name,
      class:     'elementor-field elementor-size-lg elementor-field-textual',
      autocomplete: 'off',
      value:     ''
    });

    $wrapper.append($input);
    return $wrapper;          // wrapper is returned, but we’ll keep a reference to the input
  }

  /* ------------------------------------------------------------------ */
  /* 4️⃣  Create the hidden fields if they’re not already present */
  /* ------------------------------------------------------------------ */
  var $areaNameInput, $sourceNameInput;

  if (!$('#form-field-area_name').length) {
    $areaNameInput = createHiddenField(
      'form-field-area_name',
      'form_fields[area_name]',
      'area_name'
    );
    $lastHidden.after($areaNameInput);
  } else {
    $areaNameInput = $('#form-field-area_name').closest('div.elementor-field-group');
  }

  if (!$('#form-field-source_name').length) {
    $sourceNameInput = createHiddenField(
      'form-field-source_name',
      'form_fields[source_name]',
      'source_name'
    );
    // Insert source_name after the area_name wrapper
    $areaNameInput.after($sourceNameInput);
  } else {
    $sourceNameInput = $('#form-field-source_name').closest('div.elementor-field-group');
  }

  /* ------------------------------------------------------------------ */
  /* 5️⃣  Debounce helper (500 ms is a good default) */
  /* ------------------------------------------------------------------ */
  function debounce(fn, delay) {
    var timer;
    return function () {
      var context = this, args = arguments;
      clearTimeout(timer);
      timer = setTimeout(function () { fn.apply(context, args); }, delay);
    };
  }

  /* ------------------------------------------------------------------ */
  /* 6️⃣  Keep track of the current AJAX request so we can abort it */
  /* ------------------------------------------------------------------ */
  var currentRequest = null;

  /* ------------------------------------------------------------------ */
  /* 7️⃣  Core lookup function */
  /* ------------------------------------------------------------------ */
  function lookupPostcode(postcode) {
    if (!postcode) return;

    // Abort any previous request
    if (currentRequest && currentRequest.readyState !== 4) {
      currentRequest.abort();
    }

    // Disable the region dropdown while we wait
    $regionSelect.prop('disabled', true);

    // Strip spaces/underscores before sending
    var cleaned = postcode.replace(/\s|_/g, '');

    currentRequest = $.ajax({
// first part is a CORS PROXY running on CLOUDFLARE
// Second part is a custom api that lokups GOV UK ASF POSTCODES for skill sfunding and combined with Postcodes.io result
      url: 'https://cors.workers.dev/api/?url=' +
           encodeURIComponent('https://system.com/postcodes/v2/api/asf?postcode=' + cleaned),
      dataType: 'json',
      method: 'GET',
      success: function (data) {
        /* 1️⃣  Set region if present */
        if (data.api_data && data.api_data.region) {
          var region = data.api_data.region;
          var $option = $regionSelect.find('option[value="' + region + '"]');
          $regionSelect.val($option.length ? region : '');
        } else {
          $regionSelect.val('');
        }

        /* 2️⃣  Set hidden fields if present */
        if (data.asf) {
          // Find the actual <input> inside the wrapper and set its value
          $areaNameInput.find('input').val(data.asf.area_name || '');
          $sourceNameInput.find('input').val(data.asf.source_name || '');
        }
      },
      error: function (jqXHR, textStatus, errorThrown) {
        console.error('Postcode lookup failed:', textStatus, errorThrown);
      },
      complete: function () {
        // Re‑enable the dropdown once the request is finished
        $regionSelect.prop('disabled', false);
      }
    });
  }

  /* ------------------------------------------------------------------ */
  /* 8️⃣  Fire lookup when the postcode field loses focus (blur) */
  /* ------------------------------------------------------------------ */
  $zipInput.on('blur', debounce(function () {
    var postcode = $(this).val().trim();
    lookupPostcode(postcode);
  }, 500));   // 500 ms debounce – remove if you want instant blur
});