Aggiungere funzionalità jQuery a Wicket

    • Raggiungere la pagina del progetto, dove potete trovare delle indicazioni esaustive delle varie funzionalità pubblicate.
    • aggiungere il jar file di jqwicket al proprio progetto
    • aggiungere nell’init dell’application
addPreComponentOnBeforeRenderListener(new JQComponentOnBeforeRenderListener());
    • Utilizzare una delle possibili funzionalità: io ho scelto il notifier, creando un notifier panel e aggiungendolo alla mia dashboard
add(new NotifierPanel("notifier"));
    • ed infine creare la relativa pagina html per il panel
<html>
<wicket:panel>
<a wicket:id="notifier.open1">open notifier</a><br/>
<div wicket:id="notifier1">
<div id="basic-template">
<a href="#">x</a>
<h1>#{title}</h1>
<p>#{text}</p>
</div>
</div>
</wicket:panel>
</html>

Vi consiglio di scaricarvi la distro all-in-one che contiene pure jqwicket-demo che vi permette di provare le funzionalità off-line.

Se conoscete altri modi per integrare JQuery con Wicket fatemi sapere come; se volete seguire altre pillole su Wicket seguitemi su twitter.

 

Aumentare il tempo di blocco su Wicket

Premessa:

Nella web application che sto sviluppando ho un’attività che in determinate occasioni dura più di un minuto, non dovrebbe nel web,
ma immaginate la generazione di un report piuttosto complesso su centinaia di record.
L’applicazione è sviluppata con wicket che mi andava in errore presentandomi l’eccezione che dà il titolo a questo thread:

Increase the lock time for “After 1 minute the Pagemap null is still locked” Exception

trovate il thread qui:

Cosa ho fatto:

In soldoni, se non potete ridurre quel tempo di elaborazione e volete evitare l’eccezione non dovete far altro che sistemare nella vostra Application
nel metodo init:

getRequestCycleSettings().setTimeout(Duration.minutes(time));
dove in time metto un numero di minuti maggiore di 1

Wicket:pillola 2 error page

Obiettivo:Creare una pagina da visualzzare al verificarsi di un determinato errore (consideriamo ora l’errore 404).

La classe la possiamo chiamare ErrorPage404 e farla come preferiamo.

Andiamo a dichiarare nel metodo init dell’application:

mount(new QueryStringUrlCodingStrategy("error404",ErrorPage404.class));

aggiungiamo nel web.xml nel filter-mapping

<dispatcher>REQUEST</dispatcher>
<dispatcher>ERROR</dispatcher>

aggiungiamo pure

<error-page>
<error-code>404</error-code>
<location>/error404</location>
</error-page>

sempre nel file web.xml

tentiamo di visualizzare un url ad una risorsa inesistente e vedremo aprire la nostra pagina ErrorPage404

Ora non vi resta che prendere in considerazione l’elenco degli errori tipici:

400 Bad Request
401 Unauthorized
403 Forbidden (Authorization required)
404 Not Found
500 Internal Server Error
503 Service Unavailable

Wicket: Pillola 1 sbagliare con stile

Spesso capita di creare un form e di applicare la relativa validazione sui campi che lo compongono.

Sappiamo che aggiungendo un FeedbackPanel, in caso di validazione incorretta, appaiono i relativi messaggi.

Ma sarebbe meglio evidenziare i campi che non superano la validazione per indicare rapidamente la loro posizione.

Pratica comune è quella di aggiungere una classe CSS ai componenti che non passano la validazione

Immaginiamo di aggiungere una classe ai nostri componenti del form che abbia il comportamento appena descritto

formComponent.add(new BehaviourClass());

dove formComponent sarà il campo aggiunto al form e BehaviourClass una classe che estende

AbstractBehavior

e sovrascrivere il metodo

public void onComponentTag(Component component, ComponentTag tag)

in quest’ultimo non ci resta che verificare che il componente sia non valido e assegnargli l’attributo class con il nome scelto per la classe CSS di errore, naturalmente se il componente contiene già l’attributo class la nostra classe di errore va accodata a quella esistente.

Quindi controlliamo che esista l’attributo class

String cl = tag.getAttribute("class");

if (cl == null) {

//se non esiste lo aggiungiamo

tag.put(“class”, “errorClass”);
} else {
//se esiste già l’attributo class accodiamo la nostra classe di errore,
//che con estrema fantasia abbiamo chiamato errorClass

tag.put(“class”, “errorClass ” + cl);
}

nel file html relativo alla pagina del nostro form aggiungiamo il codice CSS necessario nei tag style:

input.errorClass { border: 2px solid red; }

dove abbiamo dato per certo che i nostri campi abbiano tag input

se i campi sottoposti a validazione sono molti forse è il caso di usare il pattern visitor per associare la classe di validazione ad ogni componente

form.visitChildren(FormComponent.class,new IVisitor<FormComponent<?>>() {
public Object component(FormComponent<?> component) {
component.add(new BehaviourClass());
return CONTINUE_TRAVERSAL;
}
}
);

In conclusione oltre l’utilizzo relativo all’indicazione degli errori, sulla mancata validazione, abbiamo visto:

  • come cambiare dinamicamente lo stile CSS ai nostri componenti
  • come aggiungere attributi ai nostri componenti attraverso il metodo put dell’oggetto ComponentTag