Select

Select is a form control, that after the click displays a collapsible list of multiple values which can be used in forms, menus or surveys.

Select enables you to use ↑ and ↓ arrow keys to navigate through options and use ↵ key to select required option (works for stateful select).

Examples

Default Select example.

import React, { useState } from "react";
import { CDBSelect, CDBContainer } from "cdbreact";
export const Select = () => {
const [option] = useState([
    {
      text: "Option 1",
      value: "1",
    },
    {
      text: "Option 2",
      value: "2",
    },
    {
      text: "Option 3",
      value: "3",
    },
  ]);
  return (
    <CDBContainer>
        <CDBSelect options={option} selected="Choose an option"/>
    </CDBContainer>
  );
};

API

In this section you will find advanced information about the Select component. You will find out which modules are required, what are the possibilities of configuring the component, and what events and methods you can use to work with it.

Contrast Select Import Statement

You need to import the Contrast Select component first before using it.

import { CDBSelect } from "cdbreact";

API Reference: Contrast Select Properties

The table below shows the configuration options of the CDBSelect component.