how to DOJO + JSON

[bfpires]

i want to make an input field with some options as autocomplete.

I have used the
roo> json add
comand and tested with curl, its alright.

now the dojo part i couldnt make.
i need a dijit.form.ComboBox that reads the json to provide autocomplete options.

How to make it?

[bfpires]

cant use Dojo.

dojo.require("dojo/store/Memory");
var store = new Memory();

dont work. how to use dojo in roo projects? couldnt find any reference in manual.

[krimple]

cant use Dojo.

dojo.require("dojo/store/Memory");
var store = new Memory();

dont work. how to use dojo in roo projects? couldnt find any reference in manual.

Take a look at the Roo tags - they embed Dojo directly.

Here's how I did it (see Chapter 7 of Spring Roo in Action for some details on how to do Roo and Dojo in more detail):

<script type="text/javascript">dojo.require('dijit.TitlePane');</script>
  <div id="_title_${sec_id}_id" class="panel">
  <h2>${sec_title}</h2>
    <script type="text/javascript">
      Spring.addDecoration(new Spring.ElementDecoration({
                elementId : '_title_${sec_id}_id', 
                widgetType : 'dijit.TitlePane', 
                widgetAttrs : {title: '${sec_title}', 
                open: ${sec_openPane}}})); 
    </script>
    <jsp:doBody />
  </div>

FWIW I don't use Dojo anymore. If I'm using Roo I will behead the Dojo widgets and do my own thing, and avoid scaffolding. I'm focusing on the AngularJS single-page web application framework, which can play nicely with Roo as a pure HTML/Javascript client. You can use @RooJson and @RooMvcJson (I forget the actual annotations) and treat Spring MVC as a smart datastore then.

[bfpires]

i can create a dojo combobox but i cant create a store and bind to it.

my jsp:

<script type="text/javascript">
dojo.require("dijit.form.ComboBox");
dojo.addOnLoad(function() {
dojo.parser.parse();
});
dojo.require("dojo.store.Memory");

</script>


<div id="combo" />
<div id="store" />

<script type="text/javascript">
var data = [
{name:"Alabama", id:"AL"},
{name:"Alaska", id:"AK"},
{name:"American Samoa", id:"AS"},
{name:"Arizona", id:"AZ"},
{name:"Arkansas", id:"AR"},
{name:"Armed Forces Europe", id:"AE"},
{name:"Armed Forces Pacific", id:"AP"},
{name:"Armed Forces the Americas", id:"AA"},
{name:"California", id:"CA"},
{name:"Colorado", id:"CO"},
{name:"Connecticut", id:"CT"},
{name:"Delaware", id:"DE"}
];
Spring.addDecoration(new Spring.ElementDecoration({
elementId : 'store',
widgetType : 'dojo.store.Memory',
widgetAttrs : {id: 'storeDojo', data: 'data' }}));
</script>


<script type="text/javascript">
Spring.addDecoration(new Spring.ElementDecoration({
elementId : 'combo',
widgetType : 'dijit.form.ComboBox',
widgetAttrs : {id: 'comboDojo', store: 'storeDojo' }}));
</script>

there is something wrong with the store.

[bfpires]

I've solved. This may help someone.
After frustrating days trying Dojo, i move to jquery and it works.

To use jquery, i added in load-scripts.tagx:

<spring:url value="/resources/styles/jquery-ui-1.10.1.custom.css" var="jqueryui_url"/>
    <spring:url value="/resources/scripts/jquery-1.9.1.js" var="jquery_url" />
	<spring:url value="/resources/scripts/jquery-ui-1.10.1.custom.js" var="jquery_autocomplete_url" />

	<link href="${jqueryui_url}" rel="stylesheet" type="text/css">        <!-- required for FF3 and Opera -->    </link>
    <script src="${jquery_url}" type="text/javascript"><!-- required for FF3 and Opera --></script>
	<script src="${jquery_autocomplete_url}" type="text/javascript"><!-- required for FF3 and Opera --></script>

and in jspx:

  <script>
            $(function() {
            	$( "#tags" ).autocomplete({
            		 source:  "/divae/alunoes/listar",
            		 delay: 2000
            	});
            });
</script>
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags" />
</div>