<!-- Standard -->
<select class="select-choices js-select-choices" id="select-choices-3678" name="select-choices-3678">
  <option value="Placeholder" placeholder="placeholder">Placeholder</option>
  <option value="Option 1 value">Option 1</option>
  <option value="Option 2 value">Option 2 wirklich, wirklich extra lang. Also wirklich extra lang.</option>
  <option value="Option 3 value">Option 3</option>
  <option value="Option 4 value">Option 4 wirklich, wirklich lang.</option>
  <option value="Option 5 value">Option 5</option>
  <option value="Option 6 value">Option 6 wirklich, wirklich extra lang. Also wirklich extra lang.</option>
  <option value="Option 7 value">Option 7</option>
  <option value="Option 8 value">Option 8 wirklich. Also wirklich extra lang.</option>
</select>

<!-- Krankenkasse -->
<select class="select-choices js-select-choices" id="select-choices-5ec8" name="select-choices-5ec8">
  <option value="none" placeholder="placeholder">Wählen sie ihre Krankenkasse</option>
  <option value="{F6142254-67E2-4947-A61F-7A3F864B289E}">actimonda krankenkasse</option>
  <option value="{4DE9DE10-21DC-4FCD-9394-6B87998321BC}">AGIDA - Die Direkte der AOK Hessen (Zweitmarke der AOK Hessen)</option>
  <option value="{F39B422E-3807-43B7-A41E-E6429D2CF585}">AOK - Die Gesundheitskasse für Niedersachsen</option>
  <option value="{5F96D619-B583-4028-834D-10B3FB3F04E1}">AOK Baden-Württemberg</option>
  <option value="{432BA371-4910-4A38-AE4D-985E1957BB1B}">AOK Bayern</option>
  <option value="{57CAB27E-0613-44F0-9C3B-3AFA265DF656}">AOK Bremen/Bremerhaven</option>
  <option value="{79ED8EFB-1CFB-44E4-A19C-D4F0B02E25F1}">AOK Hessen</option>
  <option value="{8EC7381C-5A27-4AF2-BC31-0C9220503BA4}">AOK Nordost</option>
  <option value="{B4A2369A-896F-485B-AA79-DC19DC46BBE4}">AOK NORDWEST</option>
  <option value="{E245C160-45E7-497E-BED4-2073E7871E8C}">AOK PLUS</option>
  <option value="{E1AC73A6-5187-4A4C-991A-FA7B174CA912}">AOK Rheinland-Pfalz/Saarland</option>
  <option value="{49556F6F-4ED5-4C18-879C-152800DC8C1A}">AOK Rheinland/Hamburg</option>
  <option value="{9D6BD346-C514-43EF-ABEE-45C34A24EB80}">AOK Sachsen-Anhalt</option>
  <option value="{EF3215BD-B975-494F-A472-607A938D98EE}">atlas BKK ahlmann</option>
  <option value="{8174EE31-52CB-4BF9-B88B-E277A1A23611}">Audi BKK</option>
  <option value="{246BC2FB-1B9B-4319-B3AD-B3F18543D957}">BAHN-BKK</option>
  <option value="{CCF0898B-AA04-4695-8BBD-BA92470612E1}">BARMER</option>
  <option value="{D8DA9963-8B07-4825-B630-F9052D201C48}">BERGISCHE KRANKENKASSE</option>
  <option value="{8DED4B13-CAB5-4D2B-A57D-6CA82E7EB0B9}">Bertelsmann BKK</option>
  <option value="{060418B2-6A34-4786-A678-23800ADBD77F}">Betriebskrankenkasse Mobil Oil</option>
  <option value="{A6AF079A-7FDF-45A3-8365-19888547EB11}">Betriebskrankenkasse WMF</option>
  <option value="{4FF38270-26DB-4106-B180-06A4DB769EE5}">BIG direkt gesund</option>
  <option value="{48B4FB7E-193B-4B72-A90B-7D7CB7C1BF66}">BKK Achenbach Buschhütten</option>
  <option value="{751E036C-41CB-490A-BF8D-781359699D9F}">BKK Aesculap</option>
  <option value="{2B0C96C2-FF4E-4D96-8A0E-EEF291A33A84}">BKK Akzo Nobel Bayern</option>
  <option value="{43F9FE94-3622-4EA8-90F0-593D7C6AF4E6}">BKK B. Braun Melsungen AG</option>
  <option value="{76795314-3657-4A73-8343-C66A6150B43E}">BKK BPW Bergische Achsen KG</option>
  <option value="{A352E713-2EBE-496A-8519-013E7E0C41B7}">BKK Deutsche Bank AG</option>
  <option value="{D551752C-A198-451E-BF67-830B1A556AFC}">BKK Diakonie</option>
  <option value="{62547312-07B2-4572-8D05-FBB39CCC9E97}">BKK DürkoppAdler</option>
  <option value="{D8560DE9-1080-4DC9-9742-687520D56F99}">BKK EUREGIO</option>
  <option value="{26048EC3-7269-43C9-B1D7-AD4D0F30469A}">BKK EVM</option>
  <option value="{22F07D8F-69AB-4BA0-927B-38744DD63C5E}">BKK EWE</option>
  <option value="{6FFB0D62-8F96-4081-A7C0-AB893FCE989B}">BKK exklusiv</option>
  <option value="{0DF50037-9097-46F6-A39B-7B26F84CC9F6}">BKK Faber-Castell &amp; Partner</option>
  <option value="{B38993AB-4E43-45FF-AC97-DF481B420276}">BKK firmus</option>
  <option value="{503A83A5-54A0-4B3C-8D55-C02CB816088C}">BKK Freudenberg</option>
  <option value="{DC058E47-07AE-49F4-9023-F45E356F0A63}">BKK GILDEMEISTER SEIDENSTICKER</option>
  <option value="{FA8E3917-E539-4690-948D-EF6F3947ED2D}">BKK GRILLO-WERKE AG</option>
  <option value="{5EBF3F48-B924-4199-8125-6112F5E18596}">BKK Groz-Beckert</option>
  <option value="{61CE25DC-4F25-45E9-A65A-4BBC39FD9880}">BKK HENSCHEL Plus</option>
  <option value="{29F44BB4-E5CC-4DA1-8811-85FCA0F00495}">BKK Herkules</option>
  <option value="{17A1F6BB-D377-4CB3-B9C2-3F754388D708}">BKK HMR</option>
  <option value="{8AF5D1E8-4622-4DC6-A87B-E7065CBD7A35}">BKK KARL MAYER</option>
  <option value="{CE57A20A-3899-4CD5-909A-0A7314BC1AFF}">BKK KBA</option>
  <option value="{2BC9536C-F6FF-45A2-8E62-7BD15CAC7234}">BKK Linde</option>
  <option value="{73472DDD-130F-4D4B-B7DA-4DD67D6E21BB}">BKK MAHLE</option>
  <option value="{DBBA9712-B857-4854-8EE6-C7352B418EF7}">BKK Melitta Plus</option>
  <option value="{64C72E4D-C896-47EE-B027-C56ED0853D61}">BKK Miele</option>
  <option value="{4D4F4679-14FA-4DCF-B9F7-BF66D3D99DD4}">BKK MTU</option>
  <option value="{A2CDEDD7-4EBB-4C2D-8A36-509F55F9CC57}">BKK PFAFF</option>
  <option value="{A4BA08F0-49FC-455C-94C5-203655C2D200}">BKK Pfalz</option>
  <option value="{6495E380-5E32-41E7-A459-33155451022F}">BKK ProVita</option>
  <option value="{51568BBC-DD9A-42F4-B31F-7CA6D4D19C15}">BKK Public</option>
  <option value="{44CEF6E0-BD86-40E6-89C9-B4B94B811874}">BKK PwC</option>
  <option value="{B10F73A7-9F71-4E9A-B613-91BBACC55E99}">BKK Rieker.Ricosta.Weisser</option>
  <option value="{D39CB36C-26A4-41DA-A8BA-7C21E7ED09B9}">BKK RWE</option>
  <option value="{306D861F-5EEF-4B40-A7C2-495B0E88CEBC}">BKK Salzgitter</option>
  <option value="{2556701A-F4E0-4922-A3D0-6AE9D1F30932}">BKK Scheufelen</option>
  <option value="{AC6D993D-F570-44DE-80AB-9A56C301DD75}">BKK Schwarzwald-Baar-Heuberg</option>
  <option value="{67F083B9-554C-4414-8397-601A63C681DA}">BKK STADT AUGSBURG</option>
  <option value="{73F3894A-FCF7-41B7-9070-DA713D00893E}">BKK Technoform</option>
  <option value="{C9E9B7BE-89AB-4542-8341-2A2221FF2776}">BKK Textilgruppe Hof</option>
  <option value="{D187FB58-84F7-4604-B3FA-F16769590F36}">BKK TUI</option>
  <option value="{1A1A4322-D2E2-4289-AC6F-B38BB9D85756}">BKK VBU</option>
  <option value="{DDBF5DC3-D985-4044-A526-5B211B018C92}">BKK VDN</option>
  <option value="{F8C4AF30-747B-4A25-B5DD-AC85846C6FEC}">BKK VerbundPlus</option>
  <option value="{F5E7D878-486D-4B28-B8DA-90945D8453B1}">BKK Voralb HELLER*INDEX*LEUZE</option>
  <option value="{82DBB54E-4AFD-423C-A49B-709866042E7C}">BKK Werra-Meissner</option>
  <option value="{29DD7175-9A1B-420F-A3F8-C6C95DD1F51D}">BKK Wirtschaft &amp; Finanzen</option>
  <option value="{A8866B78-D247-448A-93C8-F53FF66F534F}">BKK Würth</option>
  <option value="{F2FB273C-B908-4914-B1BC-E0636279F5AD}">BKK ZF &amp; Partner</option>
  <option value="{A5116FE0-8926-4C79-8A10-DBE4158EE9CC}">BKK24</option>
  <option value="{6A7F592D-BBFC-4A08-9E38-13FA064656EF}">BMW BKK</option>
  <option value="{7FE8EEAE-DE8A-4119-9866-1A761D58C4C2}">Bosch BKK</option>
  <option value="{D5999A7E-204E-4F6A-9C95-6098D05505CD}">Brandenburgische BKK</option>
  <option value="{3681E10B-1E3D-4964-BDB2-BB2AD5E45597}">Continentale Betriebskrankenkasse</option>
  <option value="{5E14D976-273B-45BB-9BD8-511282F9F6B9}">Daimler BKK</option>
  <option value="{06361E92-65BB-4214-AC60-F5BEF516A668}">DAK-Gesundheit</option>
  <option value="{A7EEEF34-15D9-4D89-854A-9FC76BE8D0C9}">Debeka BKK</option>
  <option value="{FB6B664E-DB0E-40DE-8547-BA06B302B84D}">Die Schwenninger Krankenkasse</option>
  <option value="{D9D39C5F-184B-40B1-B040-8D1F205A1189}">energie-BKK</option>
  <option value="{80FF5F58-CCA0-469C-B5E3-142CC6E73CB4}">EY BKK</option>
  <option value="{76356E0E-2E56-45C6-A17B-E6D30D12E29D}">Heimat Krankenkasse</option>
  <option value="{90A3F178-7F81-40E0-AD61-13EA33C2B7A4}">HEK - Hanseatische Krankenkasse</option>
  <option value="{82D27CF4-52C6-4A81-94DB-47B437042441}">hkk Krankenkasse</option>
  <option value="{11192133-2F44-4F2E-AD01-A16E1BF8D238}">IKK Brandenburg und Berlin</option>
  <option value="{9AB5E08B-C4D9-4B7D-B0B5-9AEFEC9CD1D1}">IKK classic</option>
  <option value="{B1055B54-5337-42B9-B338-76BFCCA158D5}">IKK gesund plus</option>
  <option value="{CE663511-A7B3-4FA0-8880-9CFB0B0B30BA}">IKK Nord</option>
  <option value="{0BD5F8F0-B119-4EC9-AB83-B17625DD29DA}">IKK Südwest</option>
  <option value="{107F4E77-7AC6-4984-9EFF-63A9CBA04F66}">KKH Kaufmännische Krankenkasse</option>
  <option value="{7A3228E0-F801-49CE-8BAA-E75D8F7C785E}">KNAPPSCHAFT</option>
  <option value="{E33A991B-6925-4B8B-858F-C813D11BF46D}">KRONES BKK</option>
  <option value="{872B54FB-B111-4B49-9E4D-9F22541F384F}">Merck BKK</option>
  <option value="{E121875E-DA8A-4FC9-BD3C-CE3FC632D506}">Metzinger BKK</option>
  <option value="{ABA0509C-68AC-4BEB-9F61-2AD2115647FE}">mhplus Betriebskrankenkasse</option>
  <option value="{18016206-D504-4F92-8F8C-BFD51B566455}">Novitas BKK</option>
  <option value="{535908EE-241B-4304-8470-924DDEA0E79E}">Private Krankenversicherung</option>
  <option value="{AB98D62B-CBED-45A7-B2C7-80A79FCBA6B4}">pronova BKK</option>
  <option value="{CE1428EF-C0D5-4BFC-A465-CD6717D6F5CE}">R+V Betriebskrankenkasse</option>
  <option value="{BC531197-D076-4A43-B477-577C543E2F89}">Salus BKK</option>
  <option value="{AC1A1129-ADEC-4F26-A65C-84E9AF78D107}">SBK</option>
  <option value="{ACAACF79-9808-4CC5-8027-A1BA30B54B11}">SECURVITA Krankenkasse</option>
  <option value="{644F6749-25EC-40DB-9EE4-C8FA1B0D9E9A}">SIEMAG BKK</option>
  <option value="{70050003-9361-4538-A6FF-DE61B096245B}">SKD BKK</option>
  <option value="{195D7333-B2D9-4694-B672-9B0B1D83E25F}">Sozialversicherung für Landwirtschaft, Forsten und Gartenbau</option>
  <option value="{5AB19555-3970-4A46-953E-D004461DA57A}">Südzucker-BKK</option>
  <option value="{496F2C19-237D-4A0A-8B1D-3D318FBB309A}">TBK Thüringer Betriebskrankenkasse</option>
  <option value="{E8CC3481-EE3D-4C29-93B4-BFF6C24B65F1}">TK - Techniker Krankenkasse</option>
  <option value="{ED413815-EEF8-436F-9531-6364EAE2E9AA}">VIACTIV Krankenkasse</option>
</select>

<!-- Krankenkasse (Optionen nachgeladen) -->
<select class="select-choices js-select-choices" id="select-choices-a1c1" name="select-choices-a1c1" data-url="/data/krankenkasse.json">
  <option value="none" placeholder="placeholder">Wählen sie ihre Krankenkasse</option>
</select>

-
  //- Prepare attr object
  attr = attr || {};
  attr.class = classList(attr.class);
  attr.id = id || attr.id || `select-choices-${randomString()}`;
  attr.name = name || attr.name || attr.id;

  //- Process options
  if (!withoutInit) {
    attr.class.push('js-select-choices');
  }

  if (disabled) {
    attr.disabled = true;
  }

  if (invalid) {
    attr['aria-invalid'] = 'true';
  }

  if (url) {
    attr['data-url'] = url;
  }

  if (borderless) {
    attr.class.push('select-choices--borderless');
  }

  if (size) {
    attr.class.push(`select-choices--${size}`);
  }

//- Render atom
select.select-choices(required=required)&attributes(attr)
  if options
    for option, optionIndex in options
      -
        //- Prepare option attributes
        optionAttr = {}

        //- Selected option
        if (optionIndex === selectedOption) optionAttr['selected'] = 'selected';
        if (option.placeholder) optionAttr['placeholder'] = 'placeholder';
        if (option.id) optionAttr.id = option.id;

      if option.value
        option(value=option.value)&attributes(optionAttr) #{option.text}
      else
        option&attributes(optionAttr) #{option}
/* Standard */
{
  "options": [
    {
      "text": "Placeholder",
      "value": "Placeholder",
      "placeholder": true,
      "disabled": true
    },
    {
      "text": "Option 1",
      "value": "Option 1 value"
    },
    {
      "text": "Option 2 wirklich, wirklich extra lang. Also wirklich extra lang.",
      "value": "Option 2 value"
    },
    {
      "text": "Option 3",
      "value": "Option 3 value"
    },
    {
      "text": "Option 4 wirklich, wirklich lang.",
      "value": "Option 4 value"
    },
    {
      "text": "Option 5",
      "value": "Option 5 value"
    },
    {
      "text": "Option 6 wirklich, wirklich extra lang. Also wirklich extra lang.",
      "value": "Option 6 value"
    },
    {
      "text": "Option 7",
      "value": "Option 7 value"
    },
    {
      "text": "Option 8 wirklich. Also wirklich extra lang.",
      "value": "Option 8 value"
    }
  ]
}

/* Krankenkasse */
{
  "options": [
    {
      "text": "Wählen sie ihre Krankenkasse",
      "value": "none",
      "placeholder": true,
      "disabled": true
    },
    {
      "value": "{F6142254-67E2-4947-A61F-7A3F864B289E}",
      "text": "actimonda krankenkasse"
    },
    {
      "value": "{4DE9DE10-21DC-4FCD-9394-6B87998321BC}",
      "text": "AGIDA - Die Direkte der AOK Hessen (Zweitmarke der AOK Hessen)"
    },
    {
      "value": "{F39B422E-3807-43B7-A41E-E6429D2CF585}",
      "text": "AOK - Die Gesundheitskasse für Niedersachsen"
    },
    {
      "value": "{5F96D619-B583-4028-834D-10B3FB3F04E1}",
      "text": "AOK Baden-Württemberg"
    },
    {
      "value": "{432BA371-4910-4A38-AE4D-985E1957BB1B}",
      "text": "AOK Bayern"
    },
    {
      "value": "{57CAB27E-0613-44F0-9C3B-3AFA265DF656}",
      "text": "AOK Bremen/Bremerhaven"
    },
    {
      "value": "{79ED8EFB-1CFB-44E4-A19C-D4F0B02E25F1}",
      "text": "AOK Hessen"
    },
    {
      "value": "{8EC7381C-5A27-4AF2-BC31-0C9220503BA4}",
      "text": "AOK Nordost"
    },
    {
      "value": "{B4A2369A-896F-485B-AA79-DC19DC46BBE4}",
      "text": "AOK NORDWEST"
    },
    {
      "value": "{E245C160-45E7-497E-BED4-2073E7871E8C}",
      "text": "AOK PLUS"
    },
    {
      "value": "{E1AC73A6-5187-4A4C-991A-FA7B174CA912}",
      "text": "AOK Rheinland-Pfalz/Saarland"
    },
    {
      "value": "{49556F6F-4ED5-4C18-879C-152800DC8C1A}",
      "text": "AOK Rheinland/Hamburg"
    },
    {
      "value": "{9D6BD346-C514-43EF-ABEE-45C34A24EB80}",
      "text": "AOK Sachsen-Anhalt"
    },
    {
      "value": "{EF3215BD-B975-494F-A472-607A938D98EE}",
      "text": "atlas BKK ahlmann"
    },
    {
      "value": "{8174EE31-52CB-4BF9-B88B-E277A1A23611}",
      "text": "Audi BKK"
    },
    {
      "value": "{246BC2FB-1B9B-4319-B3AD-B3F18543D957}",
      "text": "BAHN-BKK"
    },
    {
      "value": "{CCF0898B-AA04-4695-8BBD-BA92470612E1}",
      "text": "BARMER"
    },
    {
      "value": "{D8DA9963-8B07-4825-B630-F9052D201C48}",
      "text": "BERGISCHE KRANKENKASSE"
    },
    {
      "value": "{8DED4B13-CAB5-4D2B-A57D-6CA82E7EB0B9}",
      "text": "Bertelsmann BKK"
    },
    {
      "value": "{060418B2-6A34-4786-A678-23800ADBD77F}",
      "text": "Betriebskrankenkasse Mobil Oil"
    },
    {
      "value": "{A6AF079A-7FDF-45A3-8365-19888547EB11}",
      "text": "Betriebskrankenkasse WMF"
    },
    {
      "value": "{4FF38270-26DB-4106-B180-06A4DB769EE5}",
      "text": "BIG direkt gesund"
    },
    {
      "value": "{48B4FB7E-193B-4B72-A90B-7D7CB7C1BF66}",
      "text": "BKK Achenbach Buschhütten"
    },
    {
      "value": "{751E036C-41CB-490A-BF8D-781359699D9F}",
      "text": "BKK Aesculap"
    },
    {
      "value": "{2B0C96C2-FF4E-4D96-8A0E-EEF291A33A84}",
      "text": "BKK Akzo Nobel Bayern"
    },
    {
      "value": "{43F9FE94-3622-4EA8-90F0-593D7C6AF4E6}",
      "text": "BKK B. Braun Melsungen AG"
    },
    {
      "value": "{76795314-3657-4A73-8343-C66A6150B43E}",
      "text": "BKK BPW Bergische Achsen KG"
    },
    {
      "value": "{A352E713-2EBE-496A-8519-013E7E0C41B7}",
      "text": "BKK Deutsche Bank AG"
    },
    {
      "value": "{D551752C-A198-451E-BF67-830B1A556AFC}",
      "text": "BKK Diakonie"
    },
    {
      "value": "{62547312-07B2-4572-8D05-FBB39CCC9E97}",
      "text": "BKK DürkoppAdler"
    },
    {
      "value": "{D8560DE9-1080-4DC9-9742-687520D56F99}",
      "text": "BKK EUREGIO"
    },
    {
      "value": "{26048EC3-7269-43C9-B1D7-AD4D0F30469A}",
      "text": "BKK EVM"
    },
    {
      "value": "{22F07D8F-69AB-4BA0-927B-38744DD63C5E}",
      "text": "BKK EWE"
    },
    {
      "value": "{6FFB0D62-8F96-4081-A7C0-AB893FCE989B}",
      "text": "BKK exklusiv"
    },
    {
      "value": "{0DF50037-9097-46F6-A39B-7B26F84CC9F6}",
      "text": "BKK Faber-Castell & Partner"
    },
    {
      "value": "{B38993AB-4E43-45FF-AC97-DF481B420276}",
      "text": "BKK firmus"
    },
    {
      "value": "{503A83A5-54A0-4B3C-8D55-C02CB816088C}",
      "text": "BKK Freudenberg"
    },
    {
      "value": "{DC058E47-07AE-49F4-9023-F45E356F0A63}",
      "text": "BKK GILDEMEISTER SEIDENSTICKER"
    },
    {
      "value": "{FA8E3917-E539-4690-948D-EF6F3947ED2D}",
      "text": "BKK GRILLO-WERKE AG"
    },
    {
      "value": "{5EBF3F48-B924-4199-8125-6112F5E18596}",
      "text": "BKK Groz-Beckert"
    },
    {
      "value": "{61CE25DC-4F25-45E9-A65A-4BBC39FD9880}",
      "text": "BKK HENSCHEL Plus"
    },
    {
      "value": "{29F44BB4-E5CC-4DA1-8811-85FCA0F00495}",
      "text": "BKK Herkules"
    },
    {
      "value": "{17A1F6BB-D377-4CB3-B9C2-3F754388D708}",
      "text": "BKK HMR"
    },
    {
      "value": "{8AF5D1E8-4622-4DC6-A87B-E7065CBD7A35}",
      "text": "BKK KARL MAYER"
    },
    {
      "value": "{CE57A20A-3899-4CD5-909A-0A7314BC1AFF}",
      "text": "BKK KBA"
    },
    {
      "value": "{2BC9536C-F6FF-45A2-8E62-7BD15CAC7234}",
      "text": "BKK Linde"
    },
    {
      "value": "{73472DDD-130F-4D4B-B7DA-4DD67D6E21BB}",
      "text": "BKK MAHLE"
    },
    {
      "value": "{DBBA9712-B857-4854-8EE6-C7352B418EF7}",
      "text": "BKK Melitta Plus"
    },
    {
      "value": "{64C72E4D-C896-47EE-B027-C56ED0853D61}",
      "text": "BKK Miele"
    },
    {
      "value": "{4D4F4679-14FA-4DCF-B9F7-BF66D3D99DD4}",
      "text": "BKK MTU"
    },
    {
      "value": "{A2CDEDD7-4EBB-4C2D-8A36-509F55F9CC57}",
      "text": "BKK PFAFF"
    },
    {
      "value": "{A4BA08F0-49FC-455C-94C5-203655C2D200}",
      "text": "BKK Pfalz"
    },
    {
      "value": "{6495E380-5E32-41E7-A459-33155451022F}",
      "text": "BKK ProVita"
    },
    {
      "value": "{51568BBC-DD9A-42F4-B31F-7CA6D4D19C15}",
      "text": "BKK Public"
    },
    {
      "value": "{44CEF6E0-BD86-40E6-89C9-B4B94B811874}",
      "text": "BKK PwC"
    },
    {
      "value": "{B10F73A7-9F71-4E9A-B613-91BBACC55E99}",
      "text": "BKK Rieker.Ricosta.Weisser"
    },
    {
      "value": "{D39CB36C-26A4-41DA-A8BA-7C21E7ED09B9}",
      "text": "BKK RWE"
    },
    {
      "value": "{306D861F-5EEF-4B40-A7C2-495B0E88CEBC}",
      "text": "BKK Salzgitter"
    },
    {
      "value": "{2556701A-F4E0-4922-A3D0-6AE9D1F30932}",
      "text": "BKK Scheufelen"
    },
    {
      "value": "{AC6D993D-F570-44DE-80AB-9A56C301DD75}",
      "text": "BKK Schwarzwald-Baar-Heuberg"
    },
    {
      "value": "{67F083B9-554C-4414-8397-601A63C681DA}",
      "text": "BKK STADT AUGSBURG"
    },
    {
      "value": "{73F3894A-FCF7-41B7-9070-DA713D00893E}",
      "text": "BKK Technoform"
    },
    {
      "value": "{C9E9B7BE-89AB-4542-8341-2A2221FF2776}",
      "text": "BKK Textilgruppe Hof"
    },
    {
      "value": "{D187FB58-84F7-4604-B3FA-F16769590F36}",
      "text": "BKK TUI"
    },
    {
      "value": "{1A1A4322-D2E2-4289-AC6F-B38BB9D85756}",
      "text": "BKK VBU"
    },
    {
      "value": "{DDBF5DC3-D985-4044-A526-5B211B018C92}",
      "text": "BKK VDN"
    },
    {
      "value": "{F8C4AF30-747B-4A25-B5DD-AC85846C6FEC}",
      "text": "BKK VerbundPlus"
    },
    {
      "value": "{F5E7D878-486D-4B28-B8DA-90945D8453B1}",
      "text": "BKK Voralb HELLER*INDEX*LEUZE"
    },
    {
      "value": "{82DBB54E-4AFD-423C-A49B-709866042E7C}",
      "text": "BKK Werra-Meissner"
    },
    {
      "value": "{29DD7175-9A1B-420F-A3F8-C6C95DD1F51D}",
      "text": "BKK Wirtschaft & Finanzen"
    },
    {
      "value": "{A8866B78-D247-448A-93C8-F53FF66F534F}",
      "text": "BKK Würth"
    },
    {
      "value": "{F2FB273C-B908-4914-B1BC-E0636279F5AD}",
      "text": "BKK ZF & Partner"
    },
    {
      "value": "{A5116FE0-8926-4C79-8A10-DBE4158EE9CC}",
      "text": "BKK24"
    },
    {
      "value": "{6A7F592D-BBFC-4A08-9E38-13FA064656EF}",
      "text": "BMW BKK"
    },
    {
      "value": "{7FE8EEAE-DE8A-4119-9866-1A761D58C4C2}",
      "text": "Bosch BKK"
    },
    {
      "value": "{D5999A7E-204E-4F6A-9C95-6098D05505CD}",
      "text": "Brandenburgische BKK"
    },
    {
      "value": "{3681E10B-1E3D-4964-BDB2-BB2AD5E45597}",
      "text": "Continentale Betriebskrankenkasse"
    },
    {
      "value": "{5E14D976-273B-45BB-9BD8-511282F9F6B9}",
      "text": "Daimler BKK"
    },
    {
      "value": "{06361E92-65BB-4214-AC60-F5BEF516A668}",
      "text": "DAK-Gesundheit"
    },
    {
      "value": "{A7EEEF34-15D9-4D89-854A-9FC76BE8D0C9}",
      "text": "Debeka BKK"
    },
    {
      "value": "{FB6B664E-DB0E-40DE-8547-BA06B302B84D}",
      "text": "Die Schwenninger Krankenkasse"
    },
    {
      "value": "{D9D39C5F-184B-40B1-B040-8D1F205A1189}",
      "text": "energie-BKK"
    },
    {
      "value": "{80FF5F58-CCA0-469C-B5E3-142CC6E73CB4}",
      "text": "EY BKK"
    },
    {
      "value": "{76356E0E-2E56-45C6-A17B-E6D30D12E29D}",
      "text": "Heimat Krankenkasse"
    },
    {
      "value": "{90A3F178-7F81-40E0-AD61-13EA33C2B7A4}",
      "text": "HEK - Hanseatische Krankenkasse"
    },
    {
      "value": "{82D27CF4-52C6-4A81-94DB-47B437042441}",
      "text": "hkk Krankenkasse"
    },
    {
      "value": "{11192133-2F44-4F2E-AD01-A16E1BF8D238}",
      "text": "IKK Brandenburg und Berlin"
    },
    {
      "value": "{9AB5E08B-C4D9-4B7D-B0B5-9AEFEC9CD1D1}",
      "text": "IKK classic"
    },
    {
      "value": "{B1055B54-5337-42B9-B338-76BFCCA158D5}",
      "text": "IKK gesund plus"
    },
    {
      "value": "{CE663511-A7B3-4FA0-8880-9CFB0B0B30BA}",
      "text": "IKK Nord"
    },
    {
      "value": "{0BD5F8F0-B119-4EC9-AB83-B17625DD29DA}",
      "text": "IKK Südwest"
    },
    {
      "value": "{107F4E77-7AC6-4984-9EFF-63A9CBA04F66}",
      "text": "KKH Kaufmännische Krankenkasse"
    },
    {
      "value": "{7A3228E0-F801-49CE-8BAA-E75D8F7C785E}",
      "text": "KNAPPSCHAFT"
    },
    {
      "value": "{E33A991B-6925-4B8B-858F-C813D11BF46D}",
      "text": "KRONES BKK"
    },
    {
      "value": "{872B54FB-B111-4B49-9E4D-9F22541F384F}",
      "text": "Merck BKK"
    },
    {
      "value": "{E121875E-DA8A-4FC9-BD3C-CE3FC632D506}",
      "text": "Metzinger BKK"
    },
    {
      "value": "{ABA0509C-68AC-4BEB-9F61-2AD2115647FE}",
      "text": "mhplus Betriebskrankenkasse"
    },
    {
      "value": "{18016206-D504-4F92-8F8C-BFD51B566455}",
      "text": "Novitas BKK"
    },
    {
      "value": "{535908EE-241B-4304-8470-924DDEA0E79E}",
      "text": "Private Krankenversicherung"
    },
    {
      "value": "{AB98D62B-CBED-45A7-B2C7-80A79FCBA6B4}",
      "text": "pronova BKK"
    },
    {
      "value": "{CE1428EF-C0D5-4BFC-A465-CD6717D6F5CE}",
      "text": "R+V Betriebskrankenkasse"
    },
    {
      "value": "{BC531197-D076-4A43-B477-577C543E2F89}",
      "text": "Salus BKK"
    },
    {
      "value": "{AC1A1129-ADEC-4F26-A65C-84E9AF78D107}",
      "text": "SBK"
    },
    {
      "value": "{ACAACF79-9808-4CC5-8027-A1BA30B54B11}",
      "text": "SECURVITA Krankenkasse"
    },
    {
      "value": "{644F6749-25EC-40DB-9EE4-C8FA1B0D9E9A}",
      "text": "SIEMAG BKK"
    },
    {
      "value": "{70050003-9361-4538-A6FF-DE61B096245B}",
      "text": "SKD BKK"
    },
    {
      "value": "{195D7333-B2D9-4694-B672-9B0B1D83E25F}",
      "text": "Sozialversicherung für Landwirtschaft, Forsten und Gartenbau"
    },
    {
      "value": "{5AB19555-3970-4A46-953E-D004461DA57A}",
      "text": "Südzucker-BKK"
    },
    {
      "value": "{496F2C19-237D-4A0A-8B1D-3D318FBB309A}",
      "text": "TBK Thüringer Betriebskrankenkasse"
    },
    {
      "value": "{E8CC3481-EE3D-4C29-93B4-BFF6C24B65F1}",
      "text": "TK - Techniker Krankenkasse"
    },
    {
      "value": "{ED413815-EEF8-436F-9531-6364EAE2E9AA}",
      "text": "VIACTIV Krankenkasse"
    }
  ]
}

/* Krankenkasse (Optionen nachgeladen) */
{
  "url": "/data/krankenkasse.json",
  "options": [
    {
      "text": "Wählen sie ihre Krankenkasse",
      "value": "none",
      "placeholder": true,
      "disabled": true
    }
  ]
}

  • Content:
    import Choices from 'choices.js';
    
    export default function initChoices($el) {
      const dataUrl = $el.getAttribute('data-url');
      const $selectedOption = $el.querySelector('option[selected]');
      const selectedOptionValue = $selectedOption && $selectedOption.value;
    
      // Default choices setup
      const choices = new Choices($el, {
        searchResultLimit: 999,
        searchFields: ['label'],
        fuseOptions: {
          include: 'score',
          threshold: 0.45,
        },
        searchPlaceholderValue: 'Suchen',
        loadingText: 'Laden...',
        noResultsText: 'Keine Ergebnisse',
        noChoicesText: 'Keine Ergebnisse zur Auswahl',
        itemSelectText: 'Auswählen',
        classNames: {
          containerOuter: 'select-choices',
          containerInner: 'select-choices__inner',
          input: 'select-choices__input',
          inputCloned: 'select-choices__input--cloned',
          list: 'select-choices__list',
          listItems: 'select-choices__list--multiple',
          listSingle: 'select-choices__list--single',
          listDropdown: 'select-choices__list--dropdown',
          item: 'select-choices__item',
          itemSelectable: 'select-choices__item--selectable',
          itemDisabled: 'select-choices__item--disabled',
          itemChoice: 'select-choices__item--choice',
          placeholder: 'select-choices__placeholder',
          group: 'select-choices__group',
          groupHeading: 'select-choices__heading',
          button: 'select-choices__button',
        },
      });
    
      if ($el.disabled) {
        choices.disable();
      }
    
      if (dataUrl) {
        choices.ajax((callback) => {
          const request = new XMLHttpRequest();
          request.open('get', dataUrl, true);
          request.onreadystatechange = () => {
            if (request.readyState === 4) {
              const { status } = request;
    
              if (status === 200) {
                const data = JSON.parse(request.responseText);
                callback(data.items, 'value', 'label');
    
                if (selectedOptionValue) {
                  choices.setValueByChoice(selectedOptionValue);
                }
              }
            }
          };
          request.send();
        });
      }
    
      return choices;
    }
    
    // Auto init Choices.js
    document
      .querySelectorAll('.js-select-choices')
      .forEach(initChoices);
    
  • URL: /components/raw/select-choices/select-choices.js
  • Filesystem Path: src/components/atoms/select-choices/select-choices.js
  • Size: 2.2 KB
  • Content:
    // Select-Choices settings
    $default-select-size: 4.5rem;
    
    .select-choices__inner {
      @mixin select-svg($color: $color-steelgrey-xdark) {
        background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 6" width="10" height="6"><path fill="' + $color + '" fill-rule="evenodd" d="M4.96 3.54L1.7.3C1.33-.1.7-.1.3.3-.1.67-.1 1.3.3 1.7l3.95 3.96c.4.4 1.02.4 1.4 0L9.63 1.7c.4-.38.4-1.02 0-1.4-.4-.4-1.02-.4-1.4 0L4.95 3.53z"/></svg>');
      }
    
      $calc-padding: calc((#{$default-input-size} - #{$root-line-height} * #{$default-input-font-size}) / 2 - 1px);
    
      @include select-svg();
    
      background-color: #fff;
      background-position: calc(100% - 1rem - 1px) 50%;
      background-repeat: no-repeat;
      background-size: 10px 6px;
      color: $color-anthracite;
      font-weight: normal;
      padding: $calc-padding 3rem $calc-padding 1rem;
      transition-duration: $default-transition-duration;
      transition-property: border-color;
    
      // Focus, Hover
      &:hover,
      &:focus {
        border-color: $color-steelgrey-xdark;
        outline: 0;
      }
    }
    
    .select-choices__placeholder {
      color: $color-steelgrey-xdark;
      opacity: 1;
    }
    
    .select-choices__list--single {
      padding: 0;
    }
    
    .select-choices__list--dropdown {
      border-radius: 3px;
      box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.25);
      top: 1px;
    }
    
    .select-choices[data-type*='select-one'] .select-choices__input {
      border: 0;
    }
    
    .select-choices__list--dropdown .select-choices__item {
      font-size: 1.5rem;
      font-weight: 200;
      margin: 0 1rem;
      padding: 1rem 0.5rem;
    
      &:not(:last-child) {
        border-bottom: 1px solid $color-steelgrey-light;
      }
    
      &.is-highlighted {
        background-color: $color-blue;
        color: #fff;
      }
    
      &.select-choices__placeholder {
        display: none;
      }
    }
    
  • URL: /components/raw/select-choices/select-choices.scss
  • Filesystem Path: src/components/atoms/select-choices/select-choices.scss
  • Size: 1.7 KB

There are no notes for this item.