You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@wicket.apache.org by Tobias Gierke <to...@voipfuture.com> on 2020/03/16 08:56:40 UTC
Register custom, component lifecycle-scoped AJAX endpoint ?
Hi,
We have a large (>350 pages) Wicket application that is currently using
server-side charts (JFreeChart) but are looking for a smooth way to
migrate to client-side D3.js charts. Ideally we would like to be able to
do something like this:
ChartImage img = ...
img.add( new JSONBehaviour() {
public String getChartDataJSON() {
return ....;
}
} ;
The behaviour would write a callback URL as an attribute to the markup.
The callback URL would be an endpoint that returns a plain AJAX response
(the dataset to render for this chart). The tricky part is dynamically
registering a callback URL that is scoped to the life-cycle of the
component and returns a plain AJAX response. Since something similar
must already be happening for Wickert AJAX behaviours, is there a way I
can piggy-back on the same Wicket-internal mechanism to dynamically
register my own AJAX endpoint ?
Thanks in advance,
Tobias
Re: Register custom, component lifecycle-scoped AJAX endpoint ?
Posted by Martin Grigorov <mg...@apache.org>.
Hi,
Alternatively you can see whether AbstractAjaxResponse (the parent
of AbstractDefaultAjaxBehavior) will do the job. It does not deal with XML.
Or you can override
AbstractDefaultAjaxBehavior#updateAjaxAttributes(AjaxRequestAttributes
attrs) and configure it: attrs.setWicketAjaxResponse(false)
& attrs.setDataType(String)
On Mon, Mar 16, 2020 at 12:19 PM Tobias Gierke <to...@voipfuture.com>
wrote:
> Hi Rob,
>
> Ah, the
>
> cycle.scheduleRequestHandlerAfterCurrent(new TextRequestHandler(...))
>
> looks like the part I was missing (see my response to Martin's answer)
> ... CSV is even better as a response format since it's more
> space-efficient than JSON and understood by D3 directly.
>
> Thanks !
> > Not sure if this is what you want, but we extensively use JS charting
> > (HighCahrts) in Wicket. I load the csv into the charts using d3.csv JS;
> and
> > just pass the callbackurl to the component rendering the charts.
> > Snippet:
> >
> > this.csv = new AbstractAjaxBehavior() {
> > private static final long serialVersionUID = 63996137479L;
> >
> > @Override
> > public void onRequest() {
> > final RequestCycle cycle = RequestCycle.get();
> > final StringValue total =
> > cycle.getRequest().getRequestParameters().getParameterValue("total");
> > final boolean needsTotal = total.toBoolean(false);
> > String csv;
> > try {
> > csv = uiChart.getCsv(needsTotal);
> > } catch (final Exception e) {
> > LOG.error("Problem getting CSV for pivot.", e);
> > // If we don't send something back, then the javascript
> goes crazy.
> > csv = "";
> > }
> > cycle.scheduleRequestHandlerAfterCurrent(new
> > TextRequestHandler("text/csv", "UTF-8", csv));
> > }
> > };
> >
> >
> > On Mon, Mar 16, 2020 at 9:56 AM Tobias Gierke <
> tobias.gierke@voipfuture.com>
> > wrote:
> >
> >> Hi,
> >>
> >> We have a large (>350 pages) Wicket application that is currently using
> >> server-side charts (JFreeChart) but are looking for a smooth way to
> >> migrate to client-side D3.js charts. Ideally we would like to be able to
> >> do something like this:
> >>
> >> ChartImage img = ...
> >> img.add( new JSONBehaviour() {
> >>
> >> public String getChartDataJSON() {
> >> return ....;
> >> }
> >> } ;
> >>
> >> The behaviour would write a callback URL as an attribute to the markup.
> >> The callback URL would be an endpoint that returns a plain AJAX response
> >> (the dataset to render for this chart). The tricky part is dynamically
> >> registering a callback URL that is scoped to the life-cycle of the
> >> component and returns a plain AJAX response. Since something similar
> >> must already be happening for Wickert AJAX behaviours, is there a way I
> >> can piggy-back on the same Wicket-internal mechanism to dynamically
> >> register my own AJAX endpoint ?
> >>
> >> Thanks in advance,
> >> Tobias
> >>
> >>
> >>
>
> --
> Tobias Gierke
> Development
>
> VOIPFUTURE GmbH Wendenstraße 4 20097 Hamburg, Germany
> Phone +49 40 688 900 164 Fax +49 40 688 900 199
> Email tobias.gierke@voipfuture.com Web http://www.voipfuture.com
>
> CEO Jan Bastian
>
> Commercial Court AG Hamburg HRB 109896, VAT ID DE263738086
>
>
>
Re: Register custom, component lifecycle-scoped AJAX endpoint ?
Posted by Tobias Gierke <to...@voipfuture.com>.
Hi Rob,
Ah, the
cycle.scheduleRequestHandlerAfterCurrent(new TextRequestHandler(...))
looks like the part I was missing (see my response to Martin's answer)
... CSV is even better as a response format since it's more
space-efficient than JSON and understood by D3 directly.
Thanks !
> Not sure if this is what you want, but we extensively use JS charting
> (HighCahrts) in Wicket. I load the csv into the charts using d3.csv JS; and
> just pass the callbackurl to the component rendering the charts.
> Snippet:
>
> this.csv = new AbstractAjaxBehavior() {
> private static final long serialVersionUID = 63996137479L;
>
> @Override
> public void onRequest() {
> final RequestCycle cycle = RequestCycle.get();
> final StringValue total =
> cycle.getRequest().getRequestParameters().getParameterValue("total");
> final boolean needsTotal = total.toBoolean(false);
> String csv;
> try {
> csv = uiChart.getCsv(needsTotal);
> } catch (final Exception e) {
> LOG.error("Problem getting CSV for pivot.", e);
> // If we don't send something back, then the javascript goes crazy.
> csv = "";
> }
> cycle.scheduleRequestHandlerAfterCurrent(new
> TextRequestHandler("text/csv", "UTF-8", csv));
> }
> };
>
>
> On Mon, Mar 16, 2020 at 9:56 AM Tobias Gierke <to...@voipfuture.com>
> wrote:
>
>> Hi,
>>
>> We have a large (>350 pages) Wicket application that is currently using
>> server-side charts (JFreeChart) but are looking for a smooth way to
>> migrate to client-side D3.js charts. Ideally we would like to be able to
>> do something like this:
>>
>> ChartImage img = ...
>> img.add( new JSONBehaviour() {
>>
>> public String getChartDataJSON() {
>> return ....;
>> }
>> } ;
>>
>> The behaviour would write a callback URL as an attribute to the markup.
>> The callback URL would be an endpoint that returns a plain AJAX response
>> (the dataset to render for this chart). The tricky part is dynamically
>> registering a callback URL that is scoped to the life-cycle of the
>> component and returns a plain AJAX response. Since something similar
>> must already be happening for Wickert AJAX behaviours, is there a way I
>> can piggy-back on the same Wicket-internal mechanism to dynamically
>> register my own AJAX endpoint ?
>>
>> Thanks in advance,
>> Tobias
>>
>>
>>
--
Tobias Gierke
Development
VOIPFUTURE GmbH Wendenstraße 4 20097 Hamburg, Germany
Phone +49 40 688 900 164 Fax +49 40 688 900 199
Email tobias.gierke@voipfuture.com Web http://www.voipfuture.com
CEO Jan Bastian
Commercial Court AG Hamburg HRB 109896, VAT ID DE263738086
Re: Register custom, component lifecycle-scoped AJAX endpoint ?
Posted by Rob Audenaerde <ro...@gmail.com>.
Not sure if this is what you want, but we extensively use JS charting
(HighCahrts) in Wicket. I load the csv into the charts using d3.csv JS; and
just pass the callbackurl to the component rendering the charts.
Snippet:
this.csv = new AbstractAjaxBehavior() {
private static final long serialVersionUID = 63996137479L;
@Override
public void onRequest() {
final RequestCycle cycle = RequestCycle.get();
final StringValue total =
cycle.getRequest().getRequestParameters().getParameterValue("total");
final boolean needsTotal = total.toBoolean(false);
String csv;
try {
csv = uiChart.getCsv(needsTotal);
} catch (final Exception e) {
LOG.error("Problem getting CSV for pivot.", e);
// If we don't send something back, then the javascript goes crazy.
csv = "";
}
cycle.scheduleRequestHandlerAfterCurrent(new
TextRequestHandler("text/csv", "UTF-8", csv));
}
};
On Mon, Mar 16, 2020 at 9:56 AM Tobias Gierke <to...@voipfuture.com>
wrote:
> Hi,
>
> We have a large (>350 pages) Wicket application that is currently using
> server-side charts (JFreeChart) but are looking for a smooth way to
> migrate to client-side D3.js charts. Ideally we would like to be able to
> do something like this:
>
> ChartImage img = ...
> img.add( new JSONBehaviour() {
>
> public String getChartDataJSON() {
> return ....;
> }
> } ;
>
> The behaviour would write a callback URL as an attribute to the markup.
> The callback URL would be an endpoint that returns a plain AJAX response
> (the dataset to render for this chart). The tricky part is dynamically
> registering a callback URL that is scoped to the life-cycle of the
> component and returns a plain AJAX response. Since something similar
> must already be happening for Wickert AJAX behaviours, is there a way I
> can piggy-back on the same Wicket-internal mechanism to dynamically
> register my own AJAX endpoint ?
>
> Thanks in advance,
> Tobias
>
>
>
Re: Register custom, component lifecycle-scoped AJAX endpoint ?
Posted by Tobias Gierke <to...@voipfuture.com>.
Thanks, Martin!
I have one more question though: Last time I checked,
AbstractDefaultAjaxBehavior returned some custom XML to the client that
then got interpreted by wicket.js to do things like component markup
replacement etc. How do I get AbstractDefaultAjaxBehavior to return just
a plain JSON response ? There's no
AjaxRequestTarget#setJSONResponse(String) ... do I need to schedule a
special IRequestHandler to do this ?
Thanks,
Tobias
> Hi,
>
> On Mon, Mar 16, 2020 at 10:56 AM Tobias Gierke <to...@voipfuture.com>
> wrote:
>
>> Hi,
>>
>> We have a large (>350 pages) Wicket application that is currently using
>> server-side charts (JFreeChart) but are looking for a smooth way to
>> migrate to client-side D3.js charts. Ideally we would like to be able to
>> do something like this:
>>
>> ChartImage img = ...
>> img.add( new JSONBehaviour() {
>>
>> public String getChartDataJSON() {
>> return ....;
>> }
>> } ;
>>
>> The behaviour would write a callback URL as an attribute to the markup.
>> The callback URL would be an endpoint that returns a plain AJAX response
>> (the dataset to render for this chart). The tricky part is dynamically
>> registering a callback URL that is scoped to the life-cycle of the
>> component and returns a plain AJAX response. Since something similar
>> must already be happening for Wickert AJAX behaviours, is there a way I
>> can piggy-back on the same Wicket-internal mechanism to dynamically
>> register my own AJAX endpoint ?
>>
> You can do something like this:
>
> AbstractDefaultAjaxBehavior beh = new AbstractDefaultAjaxBehavior() {
> @Override public void onRequest(AjaxRequestTarget target) { ... }
> }
> component.add(beh);
> component.add(AttributeModifier.replace("data-my-special-attribute",
> beh.getCallbackUrl()));
>
> and then in your JS code: var url =
> $('#compontId').data('my-special-attribute');
>
>
>
>> Thanks in advance,
>> Tobias
>>
>>
>>
--
Tobias Gierke
Development
VOIPFUTURE GmbH Wendenstraße 4 20097 Hamburg, Germany
Phone +49 40 688 900 164 Fax +49 40 688 900 199
Email tobias.gierke@voipfuture.com Web http://www.voipfuture.com
CEO Jan Bastian
Commercial Court AG Hamburg HRB 109896, VAT ID DE263738086
Re: Register custom, component lifecycle-scoped AJAX endpoint ?
Posted by Martin Grigorov <mg...@apache.org>.
Hi,
On Mon, Mar 16, 2020 at 10:56 AM Tobias Gierke <to...@voipfuture.com>
wrote:
> Hi,
>
> We have a large (>350 pages) Wicket application that is currently using
> server-side charts (JFreeChart) but are looking for a smooth way to
> migrate to client-side D3.js charts. Ideally we would like to be able to
> do something like this:
>
> ChartImage img = ...
> img.add( new JSONBehaviour() {
>
> public String getChartDataJSON() {
> return ....;
> }
> } ;
>
> The behaviour would write a callback URL as an attribute to the markup.
> The callback URL would be an endpoint that returns a plain AJAX response
> (the dataset to render for this chart). The tricky part is dynamically
> registering a callback URL that is scoped to the life-cycle of the
> component and returns a plain AJAX response. Since something similar
> must already be happening for Wickert AJAX behaviours, is there a way I
> can piggy-back on the same Wicket-internal mechanism to dynamically
> register my own AJAX endpoint ?
>
You can do something like this:
AbstractDefaultAjaxBehavior beh = new AbstractDefaultAjaxBehavior() {
@Override public void onRequest(AjaxRequestTarget target) { ... }
}
component.add(beh);
component.add(AttributeModifier.replace("data-my-special-attribute",
beh.getCallbackUrl()));
and then in your JS code: var url =
$('#compontId').data('my-special-attribute');
>
> Thanks in advance,
> Tobias
>
>
>