made edition table row selectable

js/components/ascribe_accordion_list/accordion_list_item_table.js

@@ -3,7 +3,7 @@
 import React from 'react';
 
 import Table from '../ascribe_table/table';
-import TableItem from '../ascribe_table/table_item';
+import TableItemSelectable from '../ascribe_table/table_item_selectable';
 
 import { ColumnModel } from '../ascribe_table/models/table_models';
 
@@ -16,7 +16,8 @@ let AccordionListItemTable = React.createClass({
         show: React.PropTypes.bool,
         changeOrder: React.PropTypes.func,
         orderBy: React.PropTypes.string,
-        orderAsc: React.PropTypes.bool
+        orderAsc: React.PropTypes.bool,
+        selectItem: React.PropTypes.func
     },
 
     render() {
@@ -32,9 +33,11 @@ let AccordionListItemTable = React.createClass({
                     orderAsc={this.props.orderAsc}>
                     {this.props.itemList.map((item, i) => {
                         return (
-                             <TableItem
+                             <TableItemSelectable
                                 className="ascribe-table-item-selectable"
-                                key={i} />
+                                key={i}
+                                selectItem={this.props.selectItem}
+                                parentId={this.props.parentId}/>
                         );
                     })}
                 </Table>

js/components/ascribe_accordion_list/accordion_list_item_table_editions.js

@@ -202,7 +202,8 @@ let AccordionListItemTableEditions = React.createClass({
                     show={show}
                     orderBy={orderBy}
                     orderAsc={orderAsc}
-                    changeOrder={this.changeEditionListOrder} />
+                    changeOrder={this.changeEditionListOrder} 
+                    selectItem={this.selectItem}/>
                 <AccordionListItemTableToggle
                     className="ascribe-accordion-list-table-toggle"
                     onClick={this.loadFurtherEditions}

js/components/ascribe_table/table_item.js

@@ -12,12 +12,14 @@ let TableItem = React.createClass({
     propTypes: {
         columnList: React.PropTypes.arrayOf(React.PropTypes.instanceOf(ColumnModel)),
         columnContent: React.PropTypes.object,
-        className: React.PropTypes.string
+        className: React.PropTypes.string,
+        onClick: React.PropTypes.func
     },
 
     render() {
         return (
             <TableItemWrapper
+                onClick={this.props.onClick}
                 columnList={this.props.columnList}
                 columnContent={this.props.columnContent}
                 columnWidth={12} />

js/components/ascribe_table/table_item_checkbox.js

@@ -7,18 +7,13 @@ let TableItemCheckbox = React.createClass({
     propTypes: {
         editionId: React.PropTypes.number,
         pieceId: React.PropTypes.number,
-        selectItem: React.PropTypes.func,
         selected: React.PropTypes.bool
     },
 
-    selectItem() {
-        this.props.selectItem(this.props.pieceId, this.props.editionId);
-    },
-
     render() {
         return (
             <span>
-                <input type="checkbox" onChange={this.selectItem} checked={this.props.selected}/>
+                <input type="checkbox" checked={this.props.selected} readOnly/>
             </span>
         );
     }

js/components/ascribe_table/table_item_selectable.js

@@ -19,7 +19,7 @@ let TableItemSelectable = React.createClass({
     },
 
     selectItem() {
-        this.props.selectItem(this.props.parentId, this.props.columnContent.edition_number);
+        this.props.selectItem(this.props.parentId, this.props.columnContent.id);
     },
 
     render() {

js/components/ascribe_table/table_item_wrapper.js

@@ -11,14 +11,15 @@ let TableItemWrapper = React.createClass({
     propTypes: {
         columnList: React.PropTypes.arrayOf(React.PropTypes.instanceOf(ColumnModel)),
         columnContent: React.PropTypes.object,
-        columnWidth: React.PropTypes.number.isRequired
+        columnWidth: React.PropTypes.number.isRequired,
+        onClick: React.PropTypes.func
     },
 
     mixins: [Router.Navigation],
 
     render() {
         return (
-            <tr>
+            <tr onClick={this.props.onClick}>
                 {this.props.columnList.map((column, i) => {
 
                     let TypeElement = column.displayType;