Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
BOOK: Professional JavaScript for Web Developers ISBN: 978-0-7645-7908-0
This is the forum to discuss the Wrox book Professional JavaScript for Web Developers by Nicholas C. Zakas; ISBN: 9780764579080
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Professional JavaScript for Web Developers ISBN: 978-0-7645-7908-0 section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developersí questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Display Modes
  #1 (permalink)  
Old May 18th, 2006, 07:38 AM
Registered User
 
Join Date: May 2006
Location: Conway, MA, USA.
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default Drag and Drop Issue - XHTML?

This took me quite a while to isolate so I thought I would pass it on. I was also curious about why it occurs.

If the following 2 lines are in your file:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

The ZDragExample does not work correctly (at least in Version 2.0.3 (417.9.3)).

These are boilerplate lines I pick up from Dreamweaver that I beleive indicates that this is XHTML compliant code.

The sympton is that the draggable item does not follow the mouse but jumps to the drop target and is difficult to get to drop...



Reply With Quote
  #2 (permalink)  
Old May 18th, 2006, 11:18 AM
Registered User
 
Join Date: May 2006
Location: Conway, MA, USA.
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Another question about zlib...

The last line breaks the drag and drop (adding the second event listener.) Do I need to use the eventutil class?

Thanks in advance...


Reply With Quote
  #3 (permalink)  
Old May 18th, 2006, 11:19 AM
Registered User
 
Join Date: May 2006
Location: Conway, MA, USA.
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Oops. Here is the code...

<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<META name="description" content="Math facts game based on Betsy Ross Solataire">
<META name="keywords" content="math, facts, solataire, elementary, mental math">
<title><?php echo $page_title; ?></title>
<LINK REL=StyleSheet HREF="mathFacts.css" TYPE="text/css">
<script type="text/javascript" src="zdragdroplib.js"></script>
<script type="text/javascript">
       function doLoad() {
                var oDraggable = new zDraggable(document.getElementById("stockpile"), zDraggable.DRAG_X | zDraggable.DRAG_Y);
                var oDropTarget01 = new zDropTarget(document.getElementById("pile01"));
                var oDropTarget02 = new zDropTarget(document.getElementById("pile02"));
                var oDropTarget03 = new zDropTarget(document.getElementById("pile03"));
                var oDropTarget04 = new zDropTarget(document.getElementById("pile04"));
                var oDropTarget05 = new zDropTarget(document.getElementById("pile05"));
                var oDropTarget06 = new zDropTarget(document.getElementById("pile06"));
                var oDropTarget07 = new zDropTarget(document.getElementById("pile07"));
                var oDropTarget08 = new zDropTarget(document.getElementById("pile08"));
                var oDropTarget09 = new zDropTarget(document.getElementById("pile09"));
                var oDropTarget10 = new zDropTarget(document.getElementById("pile10"));

                // alert ("Loading") ;
                oDraggable.addDropTarget(oDropTarget01);
                oDropTarget01.addEventListener("drop", function (oEvent) {
                    oEvent.relatedTarget.moveTo(oDropTarget01.getLeft( ), oDropTarget01.getTop());
                oDraggable.addDropTarget(oDropTarget02);
                oDropTarget02.addEventListener("drop", function (oEvent) {
                    oEvent.relatedTarget.moveTo(oDropTarget02.getLeft( ), oDropTarget02.getTop());
                                    });
            }

</script>

</head>

Reply With Quote
  #4 (permalink)  
Old May 18th, 2006, 05:09 PM
Registered User
 
Join Date: May 2006
Location: Conway, MA, USA.
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default

I found the cause of the second event listener issue. It was a simple syntax error. Reading ahead to Chapter 14, I found out how to turn on JS error reporting in Safari (by the way, it seems to have improved from what the book describes). Because there was no error generates, I was mislead into thinking that adding the second event handler was the problem. Anyway, it looks good and it looks like zdragdroplib supports multiple drop targets as well as draggable elements...

The correct syntax was:

                // Pile 1
                oDraggableS.addDropTarget(oDropTarget01); // Make pile 1 a target for the stockpile
                oDraggableW.addDropTarget(oDropTarget01); // Make pile 1 a targte for the wastepile
                oDropTarget01.addEventListener("drop", function (oEvent) {
                    oEvent.relatedTarget.moveTo(oDropTarget01.getLeft( ), oDropTarget01.getTop()); });
                // Pile 2
                oDraggableS.addDropTarget(oDropTarget02);
                oDraggableW.addDropTarget(oDropTarget02);
                oDropTarget02.addEventListener("drop", function (oEvent) {
                    oEvent.relatedTarget.moveTo(oDropTarget02.getLeft( ), oDropTarget02.getTop()); });

Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
Drag and Drop batott ASP.NET 2.0 Professional 3 April 26th, 2008 07:59 PM
XHTML with Doctype disables Drag and Drop bradrice BOOK: Professional JavaScript for Web Developers ISBN: 978-0-7645-7908-0 1 December 16th, 2006 07:55 AM
Drag and drop vpinhao Beginning VB 6 0 September 11th, 2006 01:33 PM
Drag/Drop bmains Javascript 1 September 22nd, 2004 07:29 PM
Drag and drop Clive Astley Access 2 August 15th, 2003 12:11 PM



All times are GMT -4. The time now is 08:38 PM.


Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.