CountrySwitch

Content Type: Widget
Categories: User Interface

Overview

Simple dropdown to select a country and display the flag.

Documentation

CountrySwitch

Simple dropdown to select a country and display the flag

Features

Dropdown with country flags

Typical usage scenario

With a global language select or when selecting a country for phone number(s).

Limitations

Flags come from Flagpack country classes, not language codes. "nl" works because it is both the Dutch language and the Netherlands country. "en" does not, because there is no English country flag; English uses "gb" or "us". Language codes such as "en_US" and "nl_NL" use the country part after the underscore. A bare "en" falls back to "gb". Use the following country codes:

"ac", "ad", "ae", "af", "ag", "ai", "al", "am", "ao", "ar", "as", "at", "au", "aw", "ax", "az", "ba", "bb", "bd", "be", "bf", "bg", "bh", "bi", "bj", "bl", "bm", "bn", "bo", "bq", "br", "bs", "bt", "bv", "bw", "by", "bz", "ca", "cc", "cd", "cf", "cg", "ch", "ci", "ck", "cl", "cm", "cn", "co", "cr", "cu", "cv", "cw", "cx", "cy", "cz", "de", "dj", "dk", "dm", "do", "dz", "ec", "ee", "eg", "eh", "er", "es", "et", "eu", "fi", "fj", "fk", "fm", "fo", "fr", "ga", "gb-eng", "gb-nir", "gb-sct", "gb-wls", "gb-zet", "gb", "gd", "ge", "gf", "gg", "gh", "gi", "gl", "gm", "gn", "gp", "gq", "gr", "gs", "gt", "gu", "gw", "gy", "hk", "hm", "hn", "hr", "ht", "hu", "id", "ie", "il", "im", "in", "io", "iq", "ir", "is", "it", "je", "jm", "jo", "jp", "ke", "kg", "kh", "ki", "km", "kn", "kp", "kr", "kw", "ky", "kz", "la", "lb", "lc", "lgbt", "li", "lk", "lr", "ls", "lt", "lu", "lv", "ly", "ma", "mc", "md", "me", "mf", "mg", "mh", "mk", "ml", "mm", "mn", "mo", "mp", "mq", "mr", "ms", "mt", "mu", "mv", "mw", "mx", "my", "mz", "na", "nc", "ne", "nf", "ng", "ni", "nl", "no", "np", "nr", "nu", "nz", "om", "pa", "pe", "pf", "pg", "ph", "pk", "pl", "pm", "pn", "pr", "ps", "pt", "pw", "py", "qa", "re", "ro", "rs", "ru", "rw", "sa", "sb", "sc", "sd", "se", "sg", "sh", "si", "sj", "sk", "sl", "sm", "sn", "so", "sr", "ss", "st", "sv", "sx", "sy", "sz", "ta", "tc", "td", "tf", "tg", "th", "tj", "tk", "tl", "tm", "tn", "to", "tr", "tt", "tv", "tw", "tz", "ua", "ug", "um", "us", "uy", "uz", "va", "vc", "ve", "vg", "vi", "vn", "vu", "wf", "ws", "xk", "ye", "yt", "za", "zm", "zw"

Configuration

Configure either the enumeration or the language entity, not both. Show flags (default: yes) controls whether country flags are shown next to the selected value and in the options list.

Enumeration

Bind an enumeration attribute with country codes. You can set an On change action.

Language entity

Use this for the Mendix default language entity (System.Language). It works like the Combo Box language selector: the association is the current value, and Code is shown as a shortcode (en_USEN).

  1. Set Language source to a list of language objects (for example a Database source on System.Language).
  2. Map Code to System.Language.Code. The closed dropdown and the options show shortcodes such as EN, NL, DE.
  3. Optionally map Description for the hover tooltip.
  4. Bind Selected language to the current language association (for example User_Language/Language).
  5. Optionally set On language select to an action that receives the selected language object (for example a nanoflow that changes the current user language).

Development and contribution

  1. Install NPM package dependencies by using: npm install. If you use NPM v7.x.x, which can be checked by executing npm -v, execute: npm install --legacy-peer-deps.
  2. Run npm run start to watch for code changes. On every change:
    • the widget will be bundled;
    • the bundle will be included in a dist folder in the root directory of the project;
    • the bundle will be included in the deployment and widgets folder of the Mendix test project.

Bugs

none known at this moment.

Releases

Version: 2.0.0
Framework Version: 10.12.16
Release Notes:

**Improvements**

- Enhanced Configuration Flexibility: Expanded options to support broader usage scenarios.

- Widget Configuration: Configure widgets directly via enumeration or language entity, with updated editor preview and settings.



**Maintenance**

- Updated dependencies.

Version: 1.1.0
Framework Version: 10.12.16
Release Notes: - Update dependencies - Update hover styling with CSS variable - Use enumeration Caption instead of Name
Version: 1.0.2
Framework Version: 9.9.0
Release Notes: Bugfix widget classname collision with Datagrid 2
Version: 1.0.1
Framework Version: 9.5.1
Release Notes: Add system properties Clean up code
Version: 1.0.0
Framework Version: 9.4.0
Release Notes: Initial release