Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
1810
Drag and Drop + Update Panels = drop event handler fired more than once
posted

Hello,

 

I am working with the Drag and Drop framework on a page that uses Update Panels and found that, on some cases, the drop event handler fires more than once.

 

First I kind of fixed it by always updating the update panels that contained both source and target (even though I didn't make any change to the source but it worked).

 

Now I find that if I have an UpdatePanel anywhere in the page,  update it, and then perform a drag and drop, the drop event handler fires as many times as I had updated the panel.

To make it clear I attach a small project that I used to try to firgure it out.

The left tree's nodes are the source to the drag and drop.

Rigth textbox is the target. Once an object is dropped into this textbox, an asyncpostback occurs that updates the update panel in which it is contained.

Bottom textbox is written client-side every time the drop event handler fires.

UpdateLabel button generates an asyncpostback, updates the label's content and refreshes an update panel that only contains the label.

UpdateAll button does almost the same as the UpdateLabel one but it updates every updatepanel on the page (ther is also one that surrounds the tree).

 

Now the steps to reproduce the issue:

Run the project, enter the page, clickUpdateLabel as many times as you want, then drag a node from the tree to the textbox on the right and check that on the bottom textbox appear one line per UpdateLabel click(which means drop handler fires one time per UpdateLabel click).

Now reload the project, clickUpdateAll as many times as you want, drag a node from the tree to the target textbox and every should work as expected. (this step is only in case it is a hint of why all this happens).

 

Now the question: how do I fix this without updating every updatepanel on the page nor changing updatepanels for another controls like infragistics refreshpanel (it is not an option right now)

 

Notes:

Note 1: As you will see on the project I am working on VisualStudio 2010 over freamework 4. Infragistic version 10.3.20103.2088

 Note 2: I removed the ig_res folder from the project, other wise it would weight more than 200kb, you should add it in order to make it work.

 

Well, I hope it is clear enough otherwise I'll  do may best to give you any further detail you need.

 

Thanks in advance.

DragDropAndUpdatePanels.zip
Parents
  • 3726
    posted

    Hi there,

    The D&D framework uses a DragDropManager object that has one instance per page. When you perform actions using the framework, most of them are done by this manager object. Since it is on the page and you have update panels, the panels update and they register the D&D events again and again in the D&D manager. That is why I think you see multiple events fired for the same object.

    I would suggest to reset the manager by reinitializing it this way:

    $IG.DragDropManager =

     

    new $IG._DragDropManager();

    and this code should be triggered when an update panel does a postback.

    Let me know if this helps. In order for this to work you have to trigger update for all controls that do D&D on the page, because if you reset the manager by update on panel A, and you have another control in other panel B, then control in panel B may no longer work correctly. It will have to re-register all of it's events handler again.

Reply Children