StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>CSS should be fine. Otherwise, you can either use the <code>dndData</code> attribute for your items, or add the items manually to your DnD source object.</p> <p>When using <code>dojoDndItem</code> class, Dojo expects the visualization of the avatar to be already resolved in the markup itself. That's why it passes the inner HTML as the item data. This is for the most simple and common case, when you would not use a custom creator. I think using CSS to customize the avatar is fine. Even if you don't use a custom creator to set the <code>avatarStyle</code> class, you can take advantage of the fact that Dojo puts the avatar inside its own container marked with the class <code>dojoDndAvatar</code> (or <code>dojoDndAvatarItem</code>). Take a look at the source at <a href="http://svn.dojotoolkit.org/src/tags/release-1.6.1/dojo/dnd/Avatar.js" rel="nofollow">dojo/dnd/Avatar.js</a>.</p> <p>If you still want to use a custom creator, you have a couple of options:</p> <ul> <li><p>Add a <code>dndData</code> attribute to your items. In that case, that's what gets passed to the creator function as the <code>item</code> parameter. It can be anything, and you can use that to further customize the avatar. Eg. you could serialize a JSON object and dynamically create the avatar from that object, or you could set it to a unique id and then use <code>dojo.query()</code> to access the nodes below it.</p></li> <li><p>Remove the items entirely add them programmatically with the <code>insertNodes()</code> method. In that case, your creator function must implement both the case for the avatar and the case for the actual item. </p></li> </ul> <p>It doesn't address your question in particular, but here's an excellent <a href="http://blog.dezynworks.com/2011/05/drag-n-drop-with-dojo/" rel="nofollow">Dojo DnD tutorial</a>.</p> <p>The <a href="http://dojotoolkit.org/reference-guide/dojo/dnd.html" rel="nofollow">Dojo reference guide</a> is also helpful, once you understand what's happening. And of course, use the source Luke!</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload