Inter connected drop-downs not working

So I have followed this tutorial

https://world.episerver.com/blogs/Duong-Nguyen/Dates/2014/1/Country-Region-drop-down-lists-in-All-properties-mode/

in my effort to create dependent drop downs. 

    public class LocationBlock : BlockData
    {
        [SelectOne(SelectionFactoryType = typeof(CountrySelectionFactory))]
        public virtual string Country { get; set; }
        [SelectOne(SelectionFactoryType = typeof(RegionSelectionFactory))]
        [ClientEditor(ClientEditingClass = "alloy/editors/FilterableSelectionEditor", SelectionFactoryType = typeof(RegionSelectionFactory))]
        public virtual string Region { get; set; }
    }

    public class ArticlePage : StandardPage
    {
        [Display(GroupName = "IndexData")]
        public virtual LocationBlock Location { get; set; }
    }

class CountrySelectionFactory : ISelectionFactory
    {
        public IEnumerable<ISelectItem> GetSelections(ExtendedMetadata metadata)
        {
            return new Country[]
            {
            new Country() { CountryCode = "US", Name = "United States" },
            new Country() { CountryCode = "SE", Name = "Sweden" }
            };
        }
    }
    class RegionSelectionFactory : ISelectionFactory
    {
        public IEnumerable<ISelectItem> GetSelections(ExtendedMetadata metadata)
        {
            return new Region[]
            {
            new Region() { CountryCode = "US", RegionCode = "NY", Name = "New York" },
            new Region() { CountryCode = "US", RegionCode = "CA", Name = "California" },
            new Region() { CountryCode = "SE", RegionCode = "AB", Name = "Stockholm" },
            new Region() { CountryCode = "SE", RegionCode = "O", Name = "Västra Götaland" }
            };
        }
    }
    class Country : ISelectItem
    {
        public string CountryCode { get; set; }
        public string Name { get; set; }
        public string Text
        {
            get
            {
                return Name;
            }
        }
        public object Value
        {
            get
            {
                return CountryCode;
            }
        }
    }
    class Region : ISelectItem
    {
        public string CountryCode { get; set; }
        public string RegionCode { get; set; }
        public string Name { get; set; }
        public string Text
        {
            get
            {
                return Name;
            }
        }
        public object Value
        {
            get
            {
                return String.Format("{0}-{1}", CountryCode, RegionCode);
            }
        }
    }

    [EditorDescriptorRegistration(TargetType = typeof(LocationBlock))]
    public class LocationBlockEditorDescriptor : EditorDescriptor
    {
        public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes)
        {
            base.ModifyMetadata(metadata, attributes);
            metadata.Properties.Cast<ExtendedMetadata>().First().GroupSettings.ClientLayoutClass = "alloy/LocationBlockContainer";
            metadata.Properties.Cast<ExtendedMetadata>().First().ClientEditingClass = "alloy/editors/FilterableSelectionEditor";
        }
    }

After that I created a ClientResources folder in my root. Under that I created Scripts folder and placed LocationBlockConatiner there and under Scripts I created another folder named Editors and placed my FilterableSelectionEditor there. 

I created a module.config file and the code in it looks like this

<?xml version="1.0" encoding="utf-8"?><module><dojo><!-- Add a mapping from alloy to ~/ClientResources/Scripts to the dojo loader configuration --><paths><add name="alloy" path="~/ClientResources/Scripts" /><!--<add name="alloy" path="~/ClientResources" />--></paths></dojo></module>

LocationBlockContainer is this

define(["dojo/_base/declare","dojo/_base/lang","epi/shell/layout/SimpleContainer"
],
    function (
        declare,
        lang,
        SimpleContainer
    ) {
        return declare([SimpleContainer], {
            countryDropdown: null,
            regionDropdown: null,
            addChild: function (child) {
                // Summar: Add a widget to the container
                this.inherited(arguments);
                if (child.name.indexOf("country") >= 0) {
                    // If it's the country drop down list
                    this.countryDropdown = child;
                    // Connect to change event to update the region drop down list
                    this.own(this.countryDropdown.on("change", lang.hitch(this, this._updateRegionDropdown)));
                } else if (child.name.indexOf("region") >= 0) {
                    // If it's the region drop down list
                    this.regionDropdown = child;
                    // Update the region drop down
                    this._updateRegionDropdown(this.countryDropdown.value);
                }
            },
            _updateRegionDropdown: function (country) {
                console.log(1);
                if (country !== ""&& this.previousCountry === "") {
                    this.previousCountry = country;
                }
                // Clear the current value
                if (country !== this.previousCountry) {
                    this.regionDropdown.set("value", null);
                    this.previousCountry = country;
                }
                console.log(this.regionDropdown);
                // Set the filter
                this.regionDropdown.set("filter", function (region) {
                    console.log(region);
                    return region.value.indexOf(country) === 0;
                });
            }
        });
    });

FilterableSelectionEditor.js is this

define(["dojo/_base/declare","dojo/_base/array","epi-cms/contentediting/editors/SelectionEditor"
],
    function (
        declare,
        array,
        SelectionEditor
    ) {
        return declare([SelectionEditor], {
            _allOptions: null,
            filter: null,
            _setOptionsAttr: function (options) {
                // summary: set the options
                this._allOptions = options;
                this.inherited(arguments, [array.filter(options, this.filter || function () {
                    // return all options if no filter function provided.
                    return true;
                }, this)]);
            },
            _setFilterAttr: function (filter) {
                // summary: set the option filter function
                this._set("filter", filter);
                this.set("options", this._allOptions);
            }
        });
    });

It doesn't seem to work. When I select Country the Regions are emptied and then every region is added again because the end result shows all the regions no matter what country I have selected. 

Any help here would be really appreciated.