Loading ...
Sorry, an error occurred while loading the content.

45840Weird error thrown in IE but not FireFox using DragDrop

Expand Messages
  • Nathan Moschkin
    Mar 2 8:37 AM
    • 0 Attachment
      dealing with Internet Explorer (v7 or 8, doesn't matter which) :

      I am initiating a drag and drop to reorder elements on the screen ...

      But when I do, immediately it throws the error : Invalid argument, line
      125, dom.js


      el.style[property] = val;

      under the if (isIE) { } branch.

      The doctype is strict xhtml 1.0

      and the DD code I'm using is:

      var myList = new Array();
      var Dom = YAHOO.util.Dom;
      var Event = YAHOO.util.Event;
      var DDM = YAHOO.util.DragDropMgr;


      var DDReorder = function(id, sGroup, config) {

      DDReorder.superclass.constructor.call(this, id, sGroup, config);

      this.logger = this.logger || YAHOO;
      var el = this.getDragEl();
      Dom.setStyle(el, "opacity", 0.67); // The proxy is slightly transparent

      this.goingUp = false;
      this.lastY = 0;

      this.goingLeft = false;
      this.lastX = 0;
      };

      YAHOO.extend(DDReorder, YAHOO.util.DDProxy, {

      startDrag: function(x, y) {
      // this.logger.log(this.id + " startDrag");

      // make the proxy look like the source element
      var dragEl = this.getDragEl();
      var clickEl = this.getEl();
      window.clearInterval(intervalTimer);
      Dom.setStyle(clickEl, "visibility", "hidden");

      dragEl.innerHTML = clickEl.innerHTML;

      Dom.setStyle(dragEl, "color", Dom.getStyle(clickEl, "color"));
      Dom.setStyle(dragEl, "backgroundColor", Dom.getStyle(clickEl,
      "backgroundColor"));
      Dom.setStyle(dragEl, "border", Dom.getStyle(clickEl, "border"));
      },

      endDrag: function(e) {

      var srcEl = this.getEl();
      var proxy = this.getDragEl();
      var fOrder;

      // Show the proxy element and animate it to the src element's
      location
      Dom.setStyle(proxy, "visibility", "");
      var a = new YAHOO.util.Motion(
      proxy, {
      points: {
      to: Dom.getXY(srcEl)
      }
      },
      0.2,
      YAHOO.util.Easing.easeOut
      )
      var proxyid = proxy.id;
      var thisid = this.id;

      // Hide the proxy and show the source element when finished with
      the animation
      a.onComplete.subscribe(function() {
      Dom.setStyle(proxyid, "visibility", "hidden");
      Dom.setStyle(thisid, "visibility", "");
      });
      a.animate();

      // this.resetTargets();
      fOrder = getCurrentFileOrder();
      // window.alert (fOrder);
      pathGetInfo("set_file_order", fOrder, cFolder, afterSetOrder);
      if ((modeSearch == false) && (intervalTimer == 0)) intervalTimer
      = window.setInterval("checkAll()", 30000);

      },

      onDragDrop: function(e, id) {

      // If there is one drop interaction, the li was dropped either
      on the list,
      // or it was dropped on the current location of the source element.
      //if (DDM.interactionInfo.drop.length === 1) {
      //
      // // The position of the cursor at the time of the drop
      (YAHOO.util.Point)
      // var pt = DDM.interactionInfo.point;
      //
      // // The region occupied by the source element at the time
      of the drop
      // var region = DDM.interactionInfo.sourceRegion;
      //
      // // Check to see if we are over the source element's
      location. We will
      // // append to the bottom of the list once we are sure it
      was a drop in
      // // the negative space (the area of the list without any
      list items)
      // if (!region.intersect(pt)) {
      // var destEl = Dom.get(id);
      // var destDD = DDM.getDDById(id);
      // destEl.appendChild(this.getEl());
      // destDD.isEmpty = false;
      // DDM.refreshCache();
      // }
      //
      //}
      // body_resize();
      },

      onDrag: function(e) {

      // Keep track of the direction of the drag for use during onDragOver
      var y = Event.getPageY(e);
      var x = Event.getPageX(e);
      //window.alert(x + "x" + y);
      if (y < this.lastY) {
      this.goingUp = true;
      } else if (y > this.lastY) {
      this.goingUp = false;
      }

      if (x < this.lastX) {
      this.goingLeft = true;
      } else if (x > this.lastX) {
      this.goingLeft = false;
      }

      this.lastY = y;
      this.lastX = x;
      },

      onDragOver: function(e, id) {

      var srcEl = this.getEl();
      var destEl = Dom.get(id);

      var mdx;
      var mdy;

      mdy = Math.abs(e.clientY - this.lastY);
      mdx = Math.abs(e.clientX - this.lastX);



      // We are only concerned with list items, we ignore the dragover
      // notifications for the list.
      //if (destEl.nodeName.toLowerCase() == "li") {
      if (destEl.id.indexOf("reorderId_") != -1) {
      var orig_p = srcEl.parentNode;
      var p = destEl.parentNode;

      //if (mdy >= mdx) {
      // if (this.goingUp) {
      // p.insertBefore(srcEl, destEl); // insert above
      // }
      // else {
      // p.insertBefore(srcEl, destEl.nextSibling); //
      insert below
      // }
      //}
      //else {
      // if (this.goingLeft) {
      // p.insertBefore(srcEl, destEl); // insert above
      // }
      // else {
      // p.insertBefore(srcEl, destEl.nextSibling); //
      insert below
      // }
      //
      //}
      if (this.goingUp || this.goingLeft) {
      p.insertBefore(srcEl, destEl); // insert above
      } else {
      p.insertBefore(srcEl, destEl.nextSibling); // insert below
      }

      DDM.refreshCache();
      }
      }
      });

      function afterSetOrder(o) {
      //window.alert(o.result);

      }

      function getCurrentFileOrder() {
      var fs = document.getElementById("file_space");
      var ch;
      var sOut = "";
      var sT;

      ch = fs.firstChild.firstChild;

      do {

      sT = ch.id.substring(10);
      if (sOut != "") sOut += ",";
      sOut += sT;

      ch = ch.nextSibling;

      } while (ch != null);

      return sOut;

      }
    • Show all 3 messages in this topic