DungeonTiger DungeonTiger - 8 months ago 148
HTML Question

Cannot get table row selection working with semantic-ui table

I'm trying to adopt Semantic-UI and I'm having some trouble. I'd like to get row selection to work in a table.

I'm using their sample HTML below:

<table class="ui selectable celled table">


You can see that hovering over the rows does nothing. I'm guessing I'm missing some sort of behavior or event hook up but I cannot find much in the documentation.

Thanks for your helps.


It appears that you are using an old version (1.11.8) of the Semantic UI framework. Upgrading to the the latest version will allow you to use row selection without the need of custom CSS.

selectable table was introduced in version 2.0.0. - Release notes

<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js"></script>

<table class="ui selectable celled table">
      <td>No Action</td>