Accessibility

17 Feb 20221 minute to read

Keyboard interaction

The following shortcut keys are used to access the Chip control without any interruption.

Keyboard shortcuts Actions
Enter Selects the targeted chip from the ChipList/ChipCollection.
Delete Deletes the targeted chip from the ChipList/ChipCollection.
<ejs-chiplist id="chip-avatar" enableDelete="true" selection="Single">
        <e-chips>
            <e-chip text="Andrew" avatarIconCss='andrew' enabled="true"></e-chip>
            <e-chip text="Janet" avatarIconCss='janet' enabled="true"></e-chip>
            <e-chip text="Laura" avatarIconCss='laura' enabled="true"></e-chip>
            <e-chip text="Margaret" avatarIconCss='margaret' enabled="true"></e-chip>
        </e-chips>
  </ejs-chiplist>

<style>
  #chip-avatar .andrew {
    background-image: url('./andrew.png')
  }

  #chip-avatar .margaret {
    background-image: url('./margaret.png')
  }

  #chip-avatar .laura {
    background-image: url('./laura.png')
  }

  #chip-avatar .janet {
    background-image: url('./janet.png')
  }
</style>
public IActionResult Index()
    {
            return View();
    }