From b5ea5a3f537be4f75ad2395ef9962519cea0690a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javier=20=C3=81lvarez=20Medina?= Date: Thu, 13 Jan 2011 21:21:09 +0100 Subject: [PATCH] click event in the table --- cDBtable/cDBtable.js | 40 +++++++++++++++++----------------------- stylesheets/table.css | 4 ++-- 2 files changed, 19 insertions(+), 25 deletions(-) diff --git a/cDBtable/cDBtable.js b/cDBtable/cDBtable.js index d147fc6bdc..997e0a84a9 100644 --- a/cDBtable/cDBtable.js +++ b/cDBtable/cDBtable.js @@ -18,7 +18,7 @@ var loading = false; var page = 0; var defaults; - var total = 10000; + var total = 5000; var methods = { init : function(options) { @@ -30,7 +30,7 @@ getDataUrl: 'http://bioblitz.tdwg.org/api/taxonomy', style: "cDBtable.css", paginateParam: "page", - resultsPerPage: 30 + resultsPerPage: 5000 }; table = $(this)[0]; @@ -74,7 +74,7 @@ methods.addScroll(); //Cell click event - //methods.bindCellEvent(); + methods.bindCellEvent(); } @@ -126,28 +126,22 @@ }, bindCellEvent: function() { - document.ondblclick = function(event) { + $(document).click(function(event){ + var target = event.target || event.srcElement; + var targetElement = target.nodeName.toLowerCase(); - //Cross-browser event object - event = event || window.event; - //Cross-browser event target - var target = event.target || event.srcElement; - //Get target element type - var targetElement = target.nodeName.toLowerCase(); - - //Is it a link? - if (targetElement == "td") { - alert("td"); - //alert(targetElement.getAttribute('r')); - } + if (targetElement == "div") { + alert($(target).parent().attr('c')+'-'+$(target).parent().attr('r')+'-'+$(target).parent().text()); + } - //Cross-browser prevent default action - if (event.preventDefault) { - event.preventDefault(); - } else { - event.returnValue = false; - } - }; + if (event.preventDefault) { + event.preventDefault(); + event.stopPropagation(); + } else { + event.stopPropagation(); + event.returnValue = false; + } + }); } }; diff --git a/stylesheets/table.css b/stylesheets/table.css index dcdd306d4f..979bfb4bd6 100644 --- a/stylesheets/table.css +++ b/stylesheets/table.css @@ -50,11 +50,11 @@ div.table_position table thead tr th a {position:absolute; right:10px; top:10px; div.table_position table thead tr th a:hover {background-position:0 -14px;} div.table_position table tbody {} div.table_position table tbody tr {height:39px;} -div.table_position table tbody tr td {height:13px!important; width:100px!important; padding:13px; background-color:#f0f1f5; background:-moz-linear-gradient(100% 100% 90deg, #f9fafe, #f0f1f5); background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9fafe), to(#f0f1f5)); +div.table_position table tbody tr td {height:13px!important; background-color:#f0f1f5; background:-moz-linear-gradient(100% 100% 90deg, #f9fafe, #f0f1f5); background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9fafe), to(#f0f1f5)); border:1px solid #E4E5E9; border-top:none; font:normal 13px "Helvetica"; line-height:13px; color:#666666; text-shadow:0 1px white; -moz-box-shadow:inset 1px 1px 0 white; -webkit-box-shadow:inset 1px 1px 0 white;} div.table_position table tbody tr td:hover {cursor:pointer;} div.table_position table tbody tr:hover td {background: -moz-linear-gradient(100% 100% 90deg, #edf9ef, #e4F0E1); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#edf9ef), to(#e4F0E1));} -div.table_position table tbody tr td div {width:100px; overflow:hidden; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;} +div.table_position table tbody tr td div {width:100px; padding:13px; overflow:hidden; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-user-select:none; -moz-user-select:none;} div.table_position div.loading_more {position:relative; display:none; float:left; width:100%; height:45px; padding:45px 0 0; margin:1px 0 0 0; background: -moz-linear-gradient(100% 100% 90deg, #DCDDE0, #FEFEFE); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#DCDDE0), to(#FEFEFE));} div.table_position div.loading_more p {width:100%; text-align:center; font:bold 13px "Helvetica"; color:#666666;}