テーブルの行を選択するのに、チェックボックスやラジオボタンを使ってもいいのですが、jQuery UI の Selectable を使うこともできます。
Selectableのデモで出てくるのは、div要素やリスト要素が多いのですが、テーブルに適用する場合はどうしたらいいんでしょうか?
こちらのページを参考にすると、こんな感じかな?
<script type="text/javascript">
<!--
$(function() {
$("tbody.selectable").selectable({filter: 'tr'});
});
// -->
</script>
<style type="text/css">
.selectable .ui-selecting { background: #FECA40; }
.selectable .ui-selected { background: #F39814; color: white; }
</style>
これで行ごと選択できるようになりました。 複数選択もできるんですよね。
本当は領域外をクリックしたり、ESCキーを押したら、選択を解除してくれるとありがたいんですけどね。
UI Selectable の選択を、Context Menu に渡たすにはどうしたらいいんでしょうかね?