CDLIB UI

Select 

<label class="o-label2" for="select">Label</label>
<select class="o-select" name="name" id="select" aria-labelledby="labelledby">
    <option value="">Choose Your Option</option>
    <option value="1">Elegant Frozen Ball</option>
    <option value="2">Rustic Plastic Computer</option>
    <option value="3">Bespoke Wooden Towels</option>
    <option value="4">Handcrafted Frozen Tuna</option>
    <option value="5">Generic Plastic Shirt</option>
    <option value="6">Handmade Metal Shoes</option>
    <option value="7">Electronic Wooden Fish</option>
    <option value="8">Incredible Soft Bike</option>
    <option value="9">Bespoke Plastic Cheese</option>
    <option value="10">Practical Metal Salad</option>
</select>
 
{{> @label--2 }}
<select class="o-select" {{#if select.name}}name="{{ select.name }}"{{/if}} {{#if select.id}}id="{{ select.id }}"{{/if}} {{#if select.labelledby}}aria-labelledby="{{ select.labelledby }}"{{/if}}>
  {{#if select.placeholder.exists}}<option value="">{{ select.placeholder.label }}</option>{{/if}}
  {{#each selectoption}}
  <option value="{{ select.option.value }}">{{ select.option.label }}</option>
  {{/each}}
</select>
 
{
  "label": {
    "exists": true,
    "for": "select",
    "text": "Label"
  },
  "select": {
    "name": "name",
    "id": "select",
    "labelledby": "labelledby",
    "placeholder": {
      "exists": true,
      "label": "Choose Your Option"
    }
  },
  "selectoption": [
    {
      "select": {
        "option": {
          "value": 1,
          "label": "Elegant Frozen Ball"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 2,
          "label": "Rustic Plastic Computer"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 3,
          "label": "Bespoke Wooden Towels"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 4,
          "label": "Handcrafted Frozen Tuna"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 5,
          "label": "Generic Plastic Shirt"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 6,
          "label": "Handmade Metal Shoes"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 7,
          "label": "Electronic Wooden Fish"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 8,
          "label": "Incredible Soft Bike"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 9,
          "label": "Bespoke Plastic Cheese"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 10,
          "label": "Practical Metal Salad"
        }
      }
    }
  ]
}

No notes defined.