[Solved] Drag and drop from a Grid

[Andrew]

I have been (sucessfullly) using jQuery draggables to drag and drop items from a telerik grid, however the upgrade to 2010.2.825 from the Q2 210 Beta has broken that behavior in IE (but it still works in FF and Chrome. 

The draggable is implemented simply as 

 

columns.Template(o =>
              {
                 Response.write("<div class='draggable'>" + o.somestuff + "</div>");
        });


// and in the js loaded by site.master
            jQuery.fn.mydrag = function () {
             return this.draggable({
                            revert: 'invalid',
                            addClasses: false,
                            scroll: false,
                            containment: 'window',
                            helper: function (event) {
                                return $('<div class="movingSeat"></div>');
                            },
                            appendTo: '#helper',
                            start: function () {
                                dropped = false;
                            },
                            stop: function () {
                                if (dropped == true) {
                                    $(this).remove();
                                }
                            }
                        });

            }
$(".draggable").mydrag();

Any thoughts as to what might have changed to break this in IE only, do let me know.

[Atanas Korchev]

Hi Andrew,

Could you provide more details? Ideally you could send a sample project showing the problem you are facing.

Regards,
Atanas Korchev
the Telerik team

[Andrew]

I've just built a simple project to demonstrate for you and of course drag and drop from the grid works perfectly... however my real-life upgraded one does not. I'll carry on trying to isolate the issue. Thanks for your offer of help!

[Atanas Korchev]

Hello Andrew,

Are there any JavaScript errors in IE? Errors may prevent drag and drop. Also you can check if this is not some weird layout bug of IE. This can be verified by disabling the web site CSS temporarily or removing parts of your page. Also check for invalid HTML (improperly nested tags, missing closing tags etc).

Regards,
Atanas Korchev
the Telerik team

[Andrew]

Found it! I've already check the validity etc. It is a weird IE bug I think.

What I've found is that if my draggable is wrapped in a div for which hasLayout is not in effect (see http://www.satzansatz.de/cssd/onhavinglayout.html for hasLayout info) then it fails. If I remove the wrapping div, then it works. If I trigger hasLayout on the wrapper by giving it a class that triggers layout then it also works. 

I'm also embarrassed to admit that this behavior does seem to be present in the 2010.2.713 version (now I've fired up the backup version the upgrade tool made for me) so its likely not a Telerik issue at all, other than it happening in the particular combination of style sheets that make up my app.

Thanks again for your time and pointers.

Andrew

[uandme77]

Hey Andrew/Telerik

I also need to implement drag and drop row to add/delete from one grid to other grid (hierarchical grids). I was wondering if i could do so in telerik mvc grid. Do you have any solution for achieving this please let me know

Thank you..