Originally Posted by
rohit_virbhadre
Hi all,
I want to design a tree view menu in roo application like jQuery tree view,
I found that using jQuery library in the roo project is not possible.
So, is there any other way to implement the same.
Rohit,
Are you saying that this not possible because your project team is not allowed to use jQuery, or because you think it's not possible in Roo?
Have you tried mounting jQuery alongside of Dojo? You should just have to load the jQuery JS file and any framework (jqueryui, etc) and the specific css. They basically live in separate worlds but there is a compatibility script somewhere in the Dojo dojox (experimental) library. I haven't used it so I can't comment on whether it works or how...
Try this:
This morning I downloaded jquery-ui, put it in the webapp directory, and added an accordion to the index.jspx page, and it worked fine. Here's my script:
Add to webapp/tags/util/load-scripts.tagx
Code:
<!-- install jQuery -->
<spring:url value="/js/jquery-1.5.1.min.js" var="jquery_url" />
<spring:url value="/js/jquery-ui-1.8.14.custom.min.js" var="jqueryui_url" />
<spring:url value="/css/ui-lightness/jquery-ui-1.8.14.custom.css" var="jqueryui_css_url" />
<script src="${jquery_url}" type="text/javascript"><!-- required for FF3 and Opera --></script>
<script src="${jqueryui_url}" type="text/javascript"><!-- required for FF3 and Opera --></script>
<link rel="stylesheet" type="text/css" media="screen" href="${jqueryui_css_url}"><!-- required for FF3 and Opera --></link>
add to index.jspx, just below the welcome_text spring message tag (directly from the index.html file provided by jquery ui)
Code:
<script type="text/javascript">
$(function(){
// Accordion
$("#accordion").accordion({ header: "h3" });
});
</script>
<h2 class="demoHeaders">Accordion</h2>
<div id="accordion">
<div>
<h3><a href="#">First</a></h3>
<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
</div>
<div>
<h3><a href="#">Second</a></h3>
<div>Phasellus mattis tincidunt nibh.</div>
</div>
<div>
<h3><a href="#">Third</a></h3>
<div>Nam dui erat, auctor a, dignissim quis.</div>
</div>
</div>
You may have challenges interoperating with the Dojo components - for example, the client-side validation is a Dojo feature, so you'd have to create tags for each jQuery UI component you'd want to use and figure out how to hook it into the validation lifecycle, if that's something you'd want to do.
Member
Treeview like jQuery
Posting Permissions
Reply With Quote