How do you use an extended dojo.dnd.Source class in markup?
The below XHTML, a vast simplification of the real app, results in Firebug reporting "Could not load class 'my.dojo.dnd.Source":
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<style type="text/css">
@import url("http://o.aolcdn.com/dojo/1.6/开发者_运维百科dojo/resources/dojo.css");
@import url("http://o.aolcdn.com/dojo/1.6/dojo/resources/dnd.css");
</style>
<script type="text/javascript" src="http://o.aolcdn.com/dojo/1.6/dojo/dojo.xd.js" djConfig="parseOnLoad:true"></script>
<script type="text/javascript">
dojo.require("dojo.dnd.Source");
</script>
<script>
// <![CDATA[
dojo.ready(function()
{
dojo.provide("my.dojo.dnd.Source");
dojo.declare("my.dojo.dnd.Source", dojo.dnd.Source,
{
markupFactory: function(params, node)
{
params._skipStartup = true;
return new my.dojo.dnd.Source(node, params);
}
});
});
// ]]>
</script>
</head>
<body>
<ul dojoType="my.dojo.dnd.Source">
<li class="dojoDndItem">foo</li>
</ul>
</body>
</html>
In the real app, the extension does something useful, of course. Also, in the real app, the ul
is actually a table
whose contents may be repeatedly re-rendered by Ajax calls based on user action. For this post, I tried to strip the problem down to its bare essentials.
I'm not sure about the need for the markupFactory
override, but I saw it used in other examples and thought it might be necessary. The same error message is reported without it.
My suspicion is that somebody somewhere is trying to load the extended class before the dojo.declare
takes effect. If I do the dojo.provide
and dojo.declare
outside of the dojo.ready
, I get the messages dojo.dnd is undefined
and _43.clsInfo.cls.prototype is undefined
, presumably because the dojo.require
is asynchronous.
If instead of saying <ul dojoType="my.dojo.dnd.Source">
I say <ul dojoType="dojo.dnd.Source">
and use setAttribute
to set dojoType
in the onReady
function, the error message goes away. I don't know if the code actually becomes functional or not. Regardless, this wouldn't really be an acceptable solution because of the Ajax re-rendering, as I mentioned above.
Perhaps I am missing something really simple here. I would appreciate any help. Thank you.
I finally got the effect I wanted by doing the following:
- Setting parseOnLoad to false instead of true.
- Defining a 'reparse' function that set the new dojoType on the appropriate DOM nodes and reparsing the appropriate DOM subtree (using dojo.parser.parse).
- Calling reparse in the dojo.ready function and after every Ajax re-render.
See, it was simple.
精彩评论