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

Re: Using DataTable with Drag and Drop: Part II

Expand Messages
  • Mike M.
    Hey Satyam, I ve got a couple of breakthroughs on my end of things. After working with your example and some of my own code I was able to solve a couple
    Message 1 of 14 , Jan 2, 2008
    • 0 Attachment
      Hey Satyam,

      I've got a couple of breakthroughs on my end of things. After working
      with your example and some of my own code I was able to solve a couple
      issues.

      To begin with I, for now, opted not to switch over to your new method
      of only having one drag and drop listener on the table. Most of what
      I have done is based on your previous version.

      I was able to solve the disappearing borders problem by providing an
      empty event handler override for the DDProxy row element as follows:

      var ddRow = new YAHOO.util.DDProxy(sourceDT.getTrEl(i));

      ddRow.onDragDrop = function(e, id)
      {
      ..... previously discussed code .....
      };

      ddRow.endDrag = function(e)
      {
      };

      Doing this prevents some of the style changes that the default DDProxy
      endDrag method would make, namely hiding the element. It also
      prevents the DDM from moving the element to its destination location.
      I can't see that this causes any harm anywhere so it seems like a
      clean solution to me. Also, for my application I did not define any
      of the other DDProxy overrides, only the two above.

      As for the selection bug, I have yet to come up with a better
      solution. What I have done in testing is turn every tr in the source
      table into a DDProxy upon build (which I know is not a good solution
      once the table grows to any large size). I still added:

      sourceDT.subscribe("rowClickEvent",sourceDT.onEventSelectRow);

      With this setup the selection seems to work normally in the manner
      that we would want. I don't really understand how this fixed the
      situation. The reason I did the pre-DDProxy creation was simply
      because I found it irritating to have to click on a row once before
      clicking and dragging could take place.

      I hope this is of some interest to you since you've been so helpful to me.

      At this point I've got my DataTables dragging and dropping how I want
      for my application so I'm moving on to my next big problem which I
      will be creating a new post about shortly.
    • Mike M.
      One more thing! I implimented this code in my application. You ll recognize the parts that I carried over from your example. I figured that the invoice
      Message 2 of 14 , Jan 2, 2008
      • 0 Attachment
        One more thing! I implimented this code in my application. You'll
        recognize the parts that I carried over from your example. I figured
        that the invoice example on your site could, like my application,
        benefit from an extra step which would check the see if you've
        modified to quantity to 0 and, if so, delete that row from the invoice.

        I was proud of myself for coming up with this (don't laugh) so I
        thought I'd share it with you.


        function SaveQuantity(oArgs)
        {
        if (oArgs.editor.cell.innerHTML == 0)
        {
        row = this.getTrEl(oArgs.editor.cell);
        record = this.getRecord(row);

        this.deleteRow(row);
        delete recordRefs[record.getData().id];
        }
        else
        this.refreshRow(oArgs);
        };

        destDT.subscribe("editorSaveEvent", SaveQuantity);
      Your message has been successfully submitted and would be delivered to recipients shortly.