Dojo, ROO, Spring

[roo dijit] RegExp e Trim su dijit.form.ValidationTextBox

Il progetto su cui sto lavorando e derivato da spring Roo 2.3.2, il quale permette di generare automaticamente dei controlli Js con DOJO, per validare i dati inserite all’interno di un form.

Ed è stato proprio dojo e nella fattispecie dijit che mi ha dato non poche grane.

Per effettuare un controllo su di un campo email, grazie ad una espressione regolare è sufficente utilizzare la seguente sintassi:

<script type=”text/javascript”>
dojo.require(“dojox.validate.regexp”);
Spring.addDecoration(new Spring.ElementDecoration({elementId : ‘_email_id’, widgetType : ‘dijit.form.ValidationTextBox’, widgetAttrs : {promptMessage: ‘${field_validation}’, invalidMessage: ‘${field_invalid}’, regExp: “[a-zA-Z0-9._%-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}” ,required : false}}));
</script>

Le parti più importanti sono quelle in grassetto dove nella prima parte di richiama la componente di dojo che permette di utilizzare le regular expression, mentre nella seconda parte di utilizza direttamente la regular espression desiderata (nella fattispecie un controllo banale sull’email).

Mentre se si vuole inserire un controllo che permette di eliminare gli spazi vuoti è sufficiente utilizzare il trim: true

<script type=”text/javascript”>

Spring.addDecoration(new Spring.ElementDecoration({elementId : ‘_nome_id’, widgetType : ‘dijit.form.ValidationTextBox’, widgetAttrs : {promptMessage:’${field_validation}’, invalidMessage: ‘${field_invalid}’, required : false, trim:true}}));

</script>

Annunci
Dojo, Javascript, JQuery, JQuery UI, ROO

[Guida] Utilizzare JQuery 1.4.2 & JQuery UI 1.8.2 & Dojo su ROO

Non è semplice (almeno alla prima botta) utilizzare JQuery 1.4.2 insieme a JQuery UI 1.8.2 in un progetto dove è già presente il framework Dojo.

Nel mio caso il progetto era stato creato su Roo 1.0.2. con il nome di pizzashop

Per inserire JQuery è necessario modificare la pagina “default.jspx” che si trova nella cartella layout

Qui riporto la parte dell’HEAD che deve essere modificato:

<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />
<meta http-equiv=”X-UA-Compatible” content=”IE=8″ />
<spring:theme code=”styleSheet” var=”roo_css”/>
<spring:url value=”/${roo_css}” var=”roo_css_url”/>
<spring:url value=”/resources/dojo/dojo.js” var=”dojo_url”/>
<spring:url value=”/resources/dijit/themes/soria/soria.css” var=”soria_url”/>
<spring:url value=”/resources/spring/Spring.js” var=”spring_url”/>
<spring:url value=”/resources/spring/Spring-Dojo.js” var=”spring_dojo_url”/>
<spring:url value=”/static/images/fir.ico” var=”favicon” />
<link rel=”stylesheet” type=”text/css” media=”screen” href=”${roo_css_url}”><!– //required for FF3 and Opera –></link>
<link rel=”stylesheet” type=”text/css” href=”${soria_url}”><!– //required for FF3 and Opera –></link>
<link rel=”SHORTCUT ICON” href=”${favicon}” />
<script type=”text/javascript”><![CDATA[
function readCookie(name) {
var nameEQ = name + ‘=’;
var ca = document.cookie.split(‘;’);
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==’ ‘) c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
var djConfig={locale:readCookie(‘locale’)};
]]>
</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”>jQuery.noConflict();</script>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js&#8221; language=”JavaScript”></script>
<script language=”JavaScript” type=”text/javascript”>jQuery.noConflict();</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>
Il trucco stà nell’inserire dopo l’importazione di ognuna delle librerie JQUERY la notazione <script language=”JavaScript” type=”text/javascript”>jQuery.noConflict();</script> , infatti senza questa notazione il browser noterà solo la prima importazione.