The guide lacks clarity.

• The (areas) category selection prompts the Places service to provide results that match any of the following types:
  • locality
  • sublocality
  • postal_code
  • country
  • administrative_area_level_1
  • administrative_area_level_2

• '(postal_code)' is ineffective (that is incorrect).
• 'postal_code' doesn't work either.
• '(areas)' works and includes postal_code type outcomes.

Google's documentation can sometimes be difficult to understand, but after thorough research, I have managed to find the solution:

If you want to search exclusively by postal code:

types: ['postal_code']

If you want to search for addresses that include the postal code:

types: ['(regions)']

or

types: ['geocode']

Here is the relevant documentation from Google:

https://developers.google.com/maps/documentation/places/web-service/autocomplete#types

You are allowed to combine geocode and establishment types, but mixing type collections (address, (cities), or (regions)) with any other type will result in an error.

https://developers.google.com/maps/documentation/places/web-service/supported_types#table3

The supported types include:

• geocode - This requests the Place Autocomplete service to only return geocoding results, rather than business results. It is commonly used to clarify ambiguous locations.
• address - This instructs the Place Autocomplete service to only return geocoding results with precise addresses. It is typically used when the user expects to search for a specific address.
• establishment - This requests the Place Autocomplete service to only return business results.
• The (regions) type collection instructs the Places service to return results matching any of the following types:
  • locality
  • sublocality
  • postal_code
  • country
  • administrative_area_level_1
  • administrative_area_level_2
• The (cities) type collection instructs the Places service to return results that match either locality or administrative_area_level_3.

I utilized the postal_code address section type.

Ensure that you have included the places library in your script URL as follows:

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY&libraries=places&callback=initEditClntInfoAutoComplete"    async defer>  </script>

An illustrative example can be found at:

https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete

////////// SECTION FROM MY FUNCTIONING CODE
////////// Replace getByElementId with the IDs of your form inputs

  ////  Global Vars

  var  editClntInfoAutocomplete, addrStreet ="",
       addressComponets = {
                    street_number: 'short_name',
                    route: 'long_name',
                    locality: 'long_name',
                    administrative_area_level_1: 'short_name',
                    country: 'long_name',
                    postal_code: 'short_name'
       };

function initEditClntInfoAutoComplete() {   // Callback  

      editClntInfoAutocomplete = new google.maps.places.Autocomplete(
            /** @type {!HTMLInputElement} */(document.getElementById('clntInfoEditAddr1')),
            {types: ['geocode']});

        // When the user selects an address from the dropdown, populate the address
        // fields in the form.
        editClntInfoAutocomplete.addListener('place_changed', fillInEditClntInfoAddress);
    }

    function fillInEditClntInfoAddress() {

        var place = editClntInfoAutocomplete.getPlace();        

            clearPrevEditFormAddrValues();

        for ( var i = 0; i < place.address_components.length; i++) {

              var addressType = place.address_components[i].types[0]; 
              if (  addressComponets[addressType] ) {
                    var val = place.address_components[i][addressComponets[addressType]];                 

                    assignEditFormAddrFieldsValue(addressType, val );
              }

         }

           if( addrStreet != "")
                 document.getElementById("clntInfoEditAddr1").value = addrStreet;

     }

     function assignEditFormAddrFieldsValue( addressType , val ) {

            switch( addressType ) {
                case "administrative_area_level_1":
                        document.getElementById("clntInfoEditState").value = val;  break;
                case "locality":
                    document.getElementById("clntInfoEditCity").value = val;  break;
                //   case "country":
                //        document.getElementById("addressType").value = val;  break;
                case "postal_code":
                    document.getElementById("clntInfoEditZip").value = val;  break;  
                case "street_number": 
                case "route":     
                    addrStreet += " "+val;      break;

            }

     }

     function clearPrevEditFormAddrValues(){
         var editClntFrmAddrIDs = ["clntInfoEditState","clntInfoEditCity","clntInfoEditZip","clntInfoEditAddr1"];
             addrStreet = "";

         for( var frmID in editClntFrmAddrIDs )
              wrap(editClntFrmAddrIDs[frmID]).val("");
     }

I recently came across this information and felt compelled to share my insights in the hopes that it will benefit someone.

As @geocodezip rightly pointed out, it is not possible to specifically request Google for postcode results only. However, you can request regions and inform the user when there is an error in their input!

The following code snippet demonstrates how I achieve this. It utilizes two inputs: one for the address prefix (house name/number) and another for the postcode.

Prerequisites:
A div element with two inputs for searching.
Below that, a div container containing inputs with the following IDs (these IDs may have prefixes):

• Address1
• Address2
• City
• County
• Postcode
• Country

All of my user inputs are assigned the "InputControl" class, which I utilize in my function to clear previous values.

How to Use It:

var autoAddr;

function initAutocomplete() {
    autoAddr = new google.maps.places.Autocomplete(document.getElementById('AddressSearchField'), { types: ['(regions)'] });
    autoAddr.addListener('place_changed', FillInAddress);
}
function FillInAddress() {
    GooglePlacesFillAddress(autoAddr, "#AddressCont", "");
}

The Main Function:

function GooglePlacesFillAddress(Place, ContainerId, AddressPrefix) {
    var
        place = Place.getPlace(),
        arr = ['premise', 'route', 'locality', 'postal_town', 'administrative_area_level_2', 'postal_code', 'country'],
        dict = {},
        adr = $(ContainerId).find("#" + AddressPrefix + "Address1"),
        switched = false,
        switchedAgain = false,
        searchAgain = $("<p id=\"" + AddressPrefix + "AddressSearchAgain\"><a href=\"javascript:void(0)\" class=\"Under\">I would like to search again</a></p>"),
        asc = $("#" + AddressPrefix + "AddressSearchCont"),
        adressPrefixValue = $("#" + AddressPrefix + "AddressSearchPrefixField").val().trim();

    SlideShow(ContainerId),
    $(ContainerId).find("input.InputControl").val(''),
    asc.find("#" + AddressPrefix + "AddressSearchField, #" + AddressPrefix + "AddressSearchPrefixField").attr("disabled", "disabled"),
    asc.find("#" + AddressPrefix + "AddressSearchFieldButton").addClass("disabled"),
    asc.find("#" + AddressPrefix + "AddressSearchPrefixField").after(searchAgain),
    searchAgain.on("click", function () {
        $(this).remove(),
        asc.find("#" + AddressPrefix + "AddressSearchField, #" + AddressPrefix + "AddressSearchPrefixField").removeAttr("disabled").val(''),
        asc.find("#" + AddressPrefix + "AddressSearchFieldButton").removeClass("disabled"),
        asc.find("#" + AddressPrefix + "AddressSearchPrefixField").focus();
    });

    if (place.address_components && place.address_components.length)
        for (var i = 0; i < place.address_components.length; i++)
            for (var j = 0; j < place.address_components[i].types.length; j++)
                if ($.inArray(place.address_components[i].types[j], arr) >= 0)
                    dict[place.address_components[i].types[j]] = place.address_components[i]["long_name"];

    $(ContainerId).find("#" + AddressPrefix + "City").val(dict["postal_town"] || '');
    $(ContainerId).find("#" + AddressPrefix + "County").val(dict["administrative_area_level_2"] || '');
    $(ContainerId).find("#" + AddressPrefix + "Postcode").val(dict["postal_code"] || '');
    $(ContainerId).find("#" + AddressPrefix + "Country").val(dict["country"] || 'United Kingdom');

    var isPostal = false;
    if (place.types && place.types.length)
        if ($.inArray("postal_code", place.types) >= 0 && $.inArray("postal_code_prefix", place.types) < 0)
            isPostal = true;

    // Add street number
    InputAdder(adr, adressPrefixValue, true);

    // Add premise
    if (adressPrefixValue.length == 0 || adr.val().length + (dict["premise"] || '').length > 100)
        adr = $(ContainerId).find("#" + AddressPrefix + "Address2"), switched = true;
    InputAdder(adr, (dict["premise"] || ''), true);

    // Add route
    if (adr.val().length + (dict["route"] || '').length > 100) {
        adr = $(ContainerId).find("#" + AddressPrefix + (switched ? "City" : "Address2"));
        if (switched)
            switchedAgain = true;
        else
            switched = true;
    }
    InputAdder(adr, (dict["route"] || ''), !switchedAgain, adressPrefixValue.length > 0 && adr.val() == adressPrefixValue);

    // Add locality
    InputAdder(switched ? adr : $(ContainerId).find("#" + AddressPrefix + "Address2"), (dict["locality"] || ''), !switchedAgain);

    if (!isPostal)
        WriteBorderedBox(false, ContainerId, "The postcode provided doesn't seem complete or valid. Please verify the address below."),
        $(ContainerId).find("#" + AddressPrefix + "Address1").focus();
}

Helper Functions:

function InputAdder(Obj, Text, Post, DontAddComma) {
    if (Obj && Text.length > 0) {
        var
            i = Obj.val().trim() || '',
            comma = !!DontAddComma ? "" : ",";

        Obj.val(
            (Post && i.length > 0 ? i + comma + ' ' : '') +
            Text.trim() +
            (!Post && i.length > 0 ? comma + ' ' + i : ''));
    }
}
function WriteBorderedBox(outcome, identifier, text) {
    var
        box = $("<div class=\"Bordered" + (outcome ? "Success" : "Error") + "\"><p>" + text + "</p></div>");
    $(identifier).before(box);
    box.hide().slideDown(function () { $(this).delay(6000).slideUp(function () { $(this).remove(); }); });
}

To Add a Button: (similar to my implementation)

$("#AddressSearchFieldButton").click(function (e) {
    var input = document.getElementById("AddressSearchField");

    google.maps.event.trigger(input, 'focus')
    google.maps.event.trigger(input, 'keydown', { keyCode: 40 });
    google.maps.event.trigger(input, 'keydown', { keyCode: 13 });
});

After some extensive research on the internet, I managed to come up with a straightforward solution. This ingenious method involves iterating through the "address_component" and extracting the postal code.

The code looks something like this:

function initialize() {

   var inputField = document.getElementById('input_1_2_5');
   var options = {
        types: ['geocode']
    };
  autoCompleteField = new google.maps.places.Autocomplete(inputField, options);
  google.maps.event.addListener(autoCompleteField, 'place_changed', function() {
    document.getElementById('input_1_2_5').value = getPostalCode(autoCompleteField.getPlace());
  })

      
} // initialize

    function getPostalCode(place){
        for (var i = 0; i < place.address_components.length; i++) {
            for (var j = 0; j < place.address_components[i].types.length; j++) {
              if (place.address_components[i].types[j] == "postal_code") {
                console.log(place.address_components[i]);
                return place.address_components[i].long_name;
              }
            }
          }
    }