Script.aculo.us Drag n' Drop issue

Discussion in 'JavaScript' started by cesarcesar, May 15, 2007.

  1. #1
    I am using the drag and drop script found here, http://script.aculo.us/. Yes i know its a hog. Anyways, i am using the script pretty much out the box with link in the sortable div. My issue is that when clicking on a link, if you at all move the mouse, its sorts to the direction you ever so slightly moved. This is driving me nuts. I have tried to add pausing functions here and there trying to create a couple millisecond pause before dragging so the click can take effect, but i have had no luck.

    Can anyone suggest a way to alter the script, so that if i click on the link in the div, it wont drag before the href is called. Thanks. Here's my example code.

    
    <div id="page">
    
    	<?php /*   div sits in a TD cell. div ID can be anything alphanumeric. HTML inside DIV is ok.  */ ?>
    	<div id="group" class="section">
    		<h3 class="handle">Group 1</h3>
    
    		<?php /*   div ID can be anything alphanumeric, after *item_*. HTML inside DIV is ok.  */ ?>
    		<div id="item_1" class="lineitem"><a href="index.php">Item 1</a></div>
    		<div id="item_2" class="lineitem"><a href="index.php">Item 2</a></div>
    		<div id="item_3" class="lineitem"><a href="index.php">Item 3</a></div>
    		<div id="item_4" class="lineitem"><a href="index.php">Item 4</a></div>
    		<div id="item_5" class="lineitem"><a href="index.php">Item 5</a></div>
    	</div>
    </div>
    
    <script type="text/javascript">
    	// <![CDATA[
    
    	/*   add each ID from group level div.   */
    	sections = ['group'];
    
    	/*   this watches for event changes like drag and drop action   */
    	Event.observe(window,'load',init,false);
    	function init() {
    
    		/*   add a sortable.create for each group level div   */
    		Sortable.create('group',{tag:'div', dropOnEmpty: true, containment: sections, only:'lineitem'});
    	}
    
    	/*   add sortable.create for *page* div   */
    	Sortable.create('page',{tag:'div',only:'section',handle:'handle'});
    	// ]]>
    </script>
    
    Code (markup):
     
    cesarcesar, May 15, 2007 IP