2 Replies - 1820 Views - Last Post: 19 April 2008 - 08:25 AM

#1 jibber4568  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 11-February 08

Drag and Drop errors

Post icon  Posted 18 April 2008 - 09:53 AM

Hi all, i am currently working on a project were i want to set up a drag and drop shopping cart.

I took an example straight from a book and have had a few problems with it. The first problem was that when ever i went to place the item in the cart at any pace the mouse would slip off of the product and pick up the cart and start moving that instead. I got some help in Uni and managed to get that resolved, however this is only in internet explorer, the problem still exsists in firefox.

The code i got from the book was said to be ok for internet explorer and firefox, however while i was at uni i could get it to respond to a cart drop in IE but not firefox. However since comning home can't evev get IE to recognise a drop, i get an access is denied error on the text file, which simply states that you have placed an item in the cart.

I was hoping someone might be able to help me with whats causing this error and also how to fix the problems in firefox. Cheers for any help.

Jibber4568

<html>
  <head>
	<title>Ajax Drag and Drop</title>

	<style type="text/css">
	  #cd {
		position:absolute;
		z-index:200;
		background: url(padrino.jpg);
		color:#0000FF;
	  }
	
	  #target {
		position:absolute;
		background: url(cart.jpg);
		color:#000000;
	  }
	  
	
	</style>

	<script type="text/javascript">

	  var offsetX, offsetY;
  
	  function MouseEvent(e) 
	  {
		if(e) {
		  this.e = e; 
		} else {
		  this.e = window.event; 
		}

		if(e.pageX) {
		  this.x = e.pageX; 
		} else {
		  this.x = e.clientX; 
		}

		if(e.pageY) {
		  this.y = e.pageY; 
		} else {
		  this.y = e.clientY; 
		}

		if(e.target) {
		  this.target = e.target; 
		} else {
		  if(e.srcElement.id != "target")
		  {
		  this.target = e.srcElement;
		  }
		}
	  }
  
	  function addListener(type, callback) 
	  {
		if (document.addEventListener) {
		  document.addEventListener(type, callback, false);
		} else if (document.attachEvent) {
		  document.attachEvent("on"+type, callback, false);
		}
	  }
  
	  function removeListener (type, callback) 
	  {
		if (document.removeEventListener) {
		  document.removeEventListener(type, callback, false);
		} else if (document.detachEvent) {
		  document.detachEvent("on" + type, callback, false);
		}
	  }
  
	  function handleDown(e) 
	  {
		var e = new MouseEvent(e);
		addListener("mousemove", handleMove);
		addListener("mouseup", handleUp);
		offsetX = e.x - parseInt(e.target.style.left);
		offsetY = e.y - parseInt(e.target.style.top);
		document.getElementById("targetDiv").innerHTML = "";
	  }
	
	  function handleMove(e) 
	  {
		var e = new MouseEvent(e);
		if(e.target)
		{
		var x = e.x - offsetX;
		e.target.style.left = x + "px";
		var y = e.y - offsetY;
		e.target.style.top = y + "px";
		}
	  }
	
	  function handleUp(e) 
	  {
		var e = new MouseEvent(e);
		removeListener("mousemove", handleMove);
		removeListener("mouseup", handleUp);

		var target = document.getElementById("target");
		var x = parseInt(target.style.left);
		var y = parseInt(target.style.top);
		var width = parseInt(target.style.width);
		var height = parseInt(target.style.height);

		 if(e.x > x && e.x < x + width &&
		  e.y > y && e.y < y + height){
		  var XMLHttpRequestObject = false; 

		  if (window.XMLHttpRequest) {
			XMLHttpRequestObject = new XMLHttpRequest();
		  } else if (window.ActiveXObject) {
			XMLHttpRequestObject = new 
			ActiveXObject("Microsoft.XMLHTTP");
		  }

		  if(XMLHttpRequestObject) {
			XMLHttpRequestObject.open("GET", "test1.txt"); 

			XMLHttpRequestObject.onreadystatechange = function() 
			{ 
			  if (XMLHttpRequestObject.readyState == 4 && 
				XMLHttpRequestObject.status == 200) { 
				  document.getElementById("targetDiv").innerHTML =
					XMLHttpRequestObject.responseText;
				  delete XMLHttpRequestObject;
				  XMLHttpRequestObject = null;
			  } 
			} 

			XMLHttpRequestObject.send(null); 
		  }
		}
	  }
	</script>
  </head>

  <body>
	
	  <div id="targetDiv"></div>

	  <div id="cd" 
		style="left:200px; top:100px; width:80px; height:80px;"
		onmousedown="handleDown(event);"></div>
   
	  <div id="target" 
		style="left:300px; top:300px; width:350px; height:350px;">
		</div>

  </body>
</html>




This post has been edited by jibber4568: 18 April 2008 - 11:31 AM


Is This A Good Question/Topic? 0
  • +

Replies To: Drag and Drop errors

#2 ahmad_511  Icon User is offline

  • MSX
  • member icon

Reputation: 131
  • View blog
  • Posts: 722
  • Joined: 28-April 07

Re: Drag and Drop errors

Posted 18 April 2008 - 05:06 PM

hello
is the text1.txt is exist in the same directory with your page
if yes, try it on your domain or your localhost
Was This Post Helpful? 0
  • +
  • -

#3 jibber4568  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 11-February 08

Re: Drag and Drop errors

Posted 19 April 2008 - 08:25 AM

Yes it is sitting in the same directory which is located within wwwroot. I have others in their that utilise text files yet have no problems with them. Permissions are ok which leaves me very confused.

This post has been edited by jibber4568: 19 April 2008 - 08:27 AM

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1