control extender for drag and drop - help

I am trying to get drag and drop to work with data dynamically populated from a database. The basic structure layout of the page is based on the work done by Garbin at:

http://aspadvice.com/blogs/garbin/archive/2006/01/17/14730.aspx

I have a master page and some user controls to populate different areas of the page. One of the user controls gets the data from the database and then creates the HTML of the form:

<div id="content1" class="item"> <div id="content1Handle" class="itemHandle">Content 1</div> <div class="itemContent"> <asp:Login ID="myLogin" runat="server" CssClass="centered"></asp:Login> </div> </div> <div id="content2" class="item"> <div id="content2Handle" class="itemHandle">Content 2</div> <div class="itemContent"> <asp:TextBox ID="myTextBox" runat="server"></asp:TextBox> <asp:Button ID="myButton" runat="server" Text="ClickMe" /> </div> </div>

This works OK, but to create the drag and drop behavior, I need to add the following after the end of the </form> tag …

</form> <script type="text/xml-script"> <page> <components><!-- Left Area --> <control id="leftArea"> <behaviors> <dragDropList dataType="HTML" acceptedDataTypes="'HTML'" dragMode="Move" direction="Vertical"> <dropCueTemplate> <template layoutElement="dropCueTemplate" /> </dropCueTemplate> <emptyTemplate> <template layoutElement="emptyTemplate" /> </emptyTemplate> </dragDropList> </behaviors> </control><!-- Right Area --> <control id="rightArea"> <behaviors>

BUT, I do not know how … it has been suggested that I use a control extender, but having viewed the ATLAS vids on the MS website, I cannot understand how a control extender will be able to dynamically create this code after the </form> tag ?

Any ideas anyone ?

Thanks

anyone ? please ...

control cannot be created because visual studio cannot find the controls type in the contr

Just installed Ajax extensions and ajax control toolkit for Vs2005.All fine.

I can drag drop update panel or script manager.

But if I do so with ajax toolkit controls I get a a error as : "control cannot be created because visual studio cannot find the control's type in the control assembly".

I have downloaded and worked with the toolkit at my home comp and it works all fine. But here at my work its giving me this problem.

I googled up to see any solutions but dint find much help!!

So any help with this would be appreciated!! Thanks!!

Hey guys!!

Anyone for the solution??

Did you remember to register it in the GAC? On your work PC, it may not have done that automagically.

Hey thanks for that.

It did work out.

Strange I have added toolkit on couple of PC's and never saw this error.

Just added the Dll to Gac and the problem is solved on my box.

Thanks.

constrain reorder list drag area like Netflix

Is there a way to make the reorder list constrain the drag item to a column - like Netflix now does on the movie que ?

On the netflix site, when you drag a movie in the que to reorder it, the movie can only go up and down in the list ( you cant drag it all over the page like you can with the Ajax Reorder List...

Thanks for any help

bump anyone ?

Hi Uncleb,

I'm failed to logon the Netflix to get the effect due to the account issue.Based on your description,my understanding of what you want is that you want move a row from a list to another list. Just like move a row from a RecorderList to another.If I have miunderstood, please let me know.

Based on this knowledge, I'm afraid that we cannot achieve it by using RecorderList directly since it is difficult to drag an item across to another RecorderList.However, here is the information maybe you are looking for: http://www.isocra.com/articles/table_dnd.php .

I hope this helps.

Best Regards,

Jonathan

thanks Jonathan. The netflix control is a reorder style list that works almost the same way as ajax control, with a few differences.

The main difference is that when you drag an item, it can only go up or down in the list ( physically) The ajax reorder list allows the dragged item to be moved anywhere on the page ( though if it's not released on top of the reorder list , it does nothing)

Hard to explain without seeing it.

it similar to this...

http://demo.script.aculo.us/ajax/sortable_elements

Hi Uncleb,

Based on my research, I'm afraid we cannot find out a easy way to achieve your target except modify the source code. RecorderList is more complex than the most other controls in Ajax Control Toolkit. Fortunately, we can dip into the control since it is open source project. If you have any new finding , sharing them will be greatly appreciated.Thanks.

Best Regards,

Jonathan

Confirmation message on ReorderList

Using the ReorderList's drag and drop capability is awesome. However, is there to prompt for a confirmation message box before the drop?

What are the possible values for the "OnItemReorder" event? Is this the right event to call?

thanks!

On ItemReorder will fire on the server, so it's too late to put up a confirmation message.

To enable this sort of behavior, you'll need to make modifications to DropWatcherBehavior.js in the toolkit source.

This simplest way is to modify the drop method in DropWatcherBehavior. To make it more sophisticated, maybe add a property to DropWatcherBehavior that lets you specify text here, and then only do the confirm if the text is present, etc.

this.drop = function(dragMode, dataType, data) {if (window.confirm("DropHere?")) { _dragDropList.drop(dragMode, dataType, data);this.doPostBack(data.id); } }

When I make this change, do I have to rebuild the .dll file for this control? any advice?
Yes you'll need to rebuild the AtlasControlToolkit.dll to incorporate the JS change.

sburke,

I finally gotten to make this change. Now, I have a problem. WHen I hit Cancel on the confirmation message, it doesn't put the order list back to its original order. It just freeze there with the drag outline box on the screen. How would I make this change to restore it to its original state?

thanks!

Composite control with updatepanel for drag and drop

I'm trying to create a composite control with an updatepanel on it that contains an area with dropzones and draggables.

I have created the following controls:

- DragDropUpdatePanel (the control with the UpdatePanel on it)

- UpdatePanelTemplate (the contenttemplate for the updatepanel)
- contains a placeholder for the dropzones and a linkbutton to force an update

- Dropzone that implements IScriptControl

- Draggable that implements IScriptControl

- Loader, an example from another thread to update the updatepanel after a postback.

The DragDropUpdatePanel will create all dropzones and draggables in the DataBind function. This all works ok until i drop a draggable on a dropzone.
Ondrop is performing the click event of the linkbutton that will execute the DataBind method and refreshes the Updatepanel.

The result looks ok but the dropzone is always disposed and i get an and error when i try to move a draggable item.

I have created a demo that you candownload here.

Hopefully someone can explain to me what I am doing wrong.

Thanks Willem.

struggeling with it but still no result ... could someone help me out here?

thanks

got it fixed .. .. wrote an extender for the dropzone and based myself on the dropwatcherbehavior.js file from the ReorderList control in the atlascontrol toolkit.

componenet alike dragpanel

hi everybody, i want create some component(for example : label, textbox,..) alike dargpanle's ajaxtoolkit( i can drag them). but i dont know how can i do it?

Hi MarziehReader,

To create an extender , I would like to introduce thisdocument. To create a DragPanelExtender , you should dip into its source code since the AJAX Control Toolkit is an open source project.

Best regards,

Jonathan

Complete window! drag and drop + collapse + close + resize

Hey Guys and Girls

Has anyone made a panel in ATLAS which can be drag n dropped, closed, collapse and resized.. I know that these functions exist separately. However is it possible to combine them all for one panel? so it acts like typical OS window? would love to hear anyone elses experiences before embarking on trying it myself

thanks

Jonas

I think you can develop a custom web-templated-control with relative ease if you're used to develop in this "branch" of .Net coding environment.

I developed myself a control of this type (draggable/collapsible) with customizable (templated) zones.
If you need it, I'll post some code as soon as I'll get back home from office...