Spring Roo with Dojo/Dijit declative menu bar?_问答_开发者

Spring Roo with Dojo/Dijit declative menu bar?

开发者 https://www.devze.com 2023-03-24 06:13 出处：网络

I am trying to use the Dojo/Dijit declarative menu with Spring ROO 1.1.4, but even if I replace the complete roo generated menue.jspx with the example (ligthly addapted) from the Dojo/Dijit hompage, i

that is how it look

Spring Roo with Dojo/Dijit declative menu bar?

that is how should look:

Spring Roo with Dojo/Dijit declative menu bar?

My modified menu.jspx

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"
    xmlns:menu="urn:jsptagdir:/WEB-INF/tags/menu"
    xmlns:sec="http://www.springframework.org/security/tags" 
    version="2.0">
    <jsp:directive.page contentType="text/html;charset=UTF-8" />
    <jsp:output omit-xml-declaration="yes" />

    <script type="text/javascript">
            dojo.require("dijit.MenuBar");
            dojo.require("dijit.PopupMenuBarItem");
            dojo.require("dijit.Menu");
            dojo.require("dijit.MenuItem");
            dojo.require("dijit.PopupMenuItem");
        </script>   
    </head>

        <div dojoType="dijit.MenuBar" id="navMenu">
            <div dojoType="dijit.PopupMenuBarItem">
                <span>
                    File
                </span>
                <div dojoType="dijit.Menu" id="fileMenu">
                    <div dojoType="dijit.MenuItem" onClick="alert('file 1')">
                        File #1
                    </div>
                    <div dojoType="dijit.MenuItem" onClick="alert('file 2')">
                        File #2
                    </div>
                </div>
            </div>
            <div dojoType="dijit.PopupMenuBarItem">
                <span>
                    Edit
                </span>
                <div dojoType="dijit.Menu" id="editMenu">
                    <div dojoType="dijit.MenuItem" onClick="alert('edit 1')">
                        Edit #1
                    </div>
                    <div dojoType="dijit.MenuItem" onClick="alert('edit 2')">
                        Edit #2
                    </div>
                </div>
            </div>
        </div>
</jsp:root>

Can anybody give me a hint what I am doing wrong? (I know the fallback to do the menu programmatic, but I want to do开发者_如何学Go it declarative.)

The html header is looks like that:

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=8" />    

    ...
    <script type="text/javascript">var djConfig = {parseOnLoad: false, isDebug: false, locale: '${fn:toLowerCase(userLocale)}'};</script>

    <script src="${dojo_url}" type="text/javascript"><!-- required for FF3 and Opera --></script>
    <script src="${spring_url}" type="text/javascript"><!-- /required for FF3 and Opera --></script>
    <script src="${spring_dojo_url}" type="text/javascript"><!-- required for FF3 and Opera --></script>
    <script language="JavaScript" type="text/javascript">dojo.require("dojo.parser");</script>      


    <spring:message code="application_name" var="app_name"/>
    <title><spring:message code="welcome_h3" arguments="${app_name}" /></title>
</head>

I don't knows anything about Spring Roo, so maybe I'm saying something very stupid here...

Is that menu.jspx compiling into some static html? If this is the case, you can tell Dojo to parse your initial page simply by setting parseOnLoad to true on your djConfig

var djConfig = {parseOnLoad: true, ...}

(no need to require dojo.parser in this case).

On the other hand, if that template is inserted dinamicaly, you will need to call dojo.parser.parse() on the root 'navMenu' node yourself. You seem to be require-ing it, but I don't see where it is being called.

I had to use: { dojo.addOnLoad(function(){ dojo.parser.parse(); }); }

instead of parseOnLoad:true