#8765 closed bug (notabug)

Opened November 01, 2012 05:45PM UTC

Closed November 02, 2012 11:31AM UTC

click and dblclick event cannot trigger when include jquery css file

Reported by: raymondlooyc Owned by:
Priority: minor Milestone: 1.10.0
Component: ui.selectable Version: 1.9.1
Keywords: Cc:
Blocked by: Blocking:
Description

jquery ui selectable bug. click and dblclick event cannot trigger when include jquery css file

bellow is an example for this case

<!doctype html>

<html lang="en">

<head>

<meta charset="utf-8" />

<title>jQuery UI Selectable - Default functionality</title>

<!--

if add href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css

double click action cannot trigger

-->

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />

<script src="http://code.jquery.com/jquery-1.8.2.js"></script>

<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>

<link rel="stylesheet" href="/resources/demos/style.css" />

<style>

#feedback { font-size: 1.4em; }

#selectable .ui-selecting { background: #FECA40; }

#selectable .ui-selected { background: #F39814; color: white; }

#selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }

#selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }

</style>

<script>

$(function() {

$( "#selectable" ).selectable();

});

$(document).ready(function(e) {

$('#selectable li').dblclick(function() {

alert("");

});

});

</script>

</head>

<body>

<ol id="selectable">

<li class="ui-widget-content">Item 1</li>

<li class="ui-widget-content">Item 2</li>

<li class="ui-widget-content">Item 3</li>

<li class="ui-widget-content">Item 4</li>

<li class="ui-widget-content">Item 5</li>

<li class="ui-widget-content">Item 6</li>

<li class="ui-widget-content">Item 7</li>

</ol>

</body>

</html>

Attachments (0)
Change History (2)

Changed November 01, 2012 06:31PM UTC by raymondlooyc comment:1

Main Problem found

this line in the jquery-ui.css cauase the click and dblclick event cannot be trigger

.ui-selectable-helper { position: absolute; z-index: 100; border:1px dotted black; }

Changed November 02, 2012 11:31AM UTC by tj.vantoll comment:2

resolution: → notabug
status: new → closed

By design you have to set the 

distance
option (http://api.jqueryui.com/selectable/#option-distance) in order for click and dblclick events to occur. Here's an example showing this - http://jsfiddle.net/tj_vantoll/jZUDM/. There's a relevant discussion on this here - http://forum.jquery.com/topic/selectable-dosn-t-fire-click-event.