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">Generic Soft Chips</option>
    <option value="2">Bespoke Granite Hat</option>
    <option value="3">Luxurious Bronze Tuna</option>
    <option value="4">Recycled Rubber Bacon</option>
    <option value="5">Rustic Soft Towels</option>
    <option value="6">Recycled Concrete Chicken</option>
    <option value="7">Small Concrete Tuna</option>
    <option value="8">Oriental Wooden Bacon</option>
    <option value="9">Modern Plastic Hat</option>
    <option value="10">Licensed Metal Fish</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": "Generic Soft Chips"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 2,
          "label": "Bespoke Granite Hat"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 3,
          "label": "Luxurious Bronze Tuna"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 4,
          "label": "Recycled Rubber Bacon"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 5,
          "label": "Rustic Soft Towels"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 6,
          "label": "Recycled Concrete Chicken"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 7,
          "label": "Small Concrete Tuna"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 8,
          "label": "Oriental Wooden Bacon"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 9,
          "label": "Modern Plastic Hat"
        }
      }
    },
    {
      "select": {
        "option": {
          "value": 10,
          "label": "Licensed Metal Fish"
        }
      }
    }
  ]
}

No notes defined.