Search code examples
javascriptjavawicketleaflet.drawwicket-1.6

(Apache Wicket) Set java atrribute from a js function


I am brand new on Apache Wicket and I need to set value on a Java attribute. This value comes from a var on JS filled by a specific function from a specific GIS lib (https://leaflet.github.io/Leaflet.draw/docs/leaflet-draw-latest.html). This setting must be triggered by some component behavior.

Here is a simplified example code:

Wicket web page:

public class MapPage extends WebPage {

private static final long serialVersionUID = 1L;
private Integer coordinates;

// getters and setters

}

Wicket html:

<html xmlns:wicket="http://wicket.apache.org">
<head>

<!-- metas, scripts, and css imports -->
</head>

<body>
<script>
// component declarations

var coordinates = ''

map.on('draw:edited', function (e) {    

  e.layers.eachLayer(function(layer) {
    coordinates = toWKT(layer);
    // send coordinates to coordinates java attribute ??? how?? 
  });
});

</script>
</body>

Thanks a lot!


Solution

  • This is a piece of code from one of my projects, where I want to handle a click on a (HighCharts) chart. It passes data to Wicket and Wicket then updates another panel to display details related to the click.

    The relevant javascript part, where interactionurl is actually the callbackScript that is generated by the behavior later on:

      interactionurl(JSON.stringify(myDataToPass));
    

    The behaviour:

        this.add( this.interactionbehavior = new AbstractDefaultAjaxBehavior()
        {
    
            @Override
            protected void respond( final AjaxRequestTarget target )
            {
                RequestCycle cycle = RequestCycle.get();
                WebRequest webRequest = (WebRequest) cycle.getRequest();
                String param1 = webRequest.getQueryParameters().getParameterValue( "mydict" ).toString( "" );
                //param1 contains the JSON map passed from javascript.
                //you can also do stuff now, like replacing components using ajax
            }
    
            @Override
            protected void updateAjaxAttributes( AjaxRequestAttributes attributes )
            {
                super.updateAjaxAttributes( attributes );
                attributes.getExtraParameters().put( "mydict", "__PLACEHOLDER__" );
            }
    
            @Override
            public CharSequence getCallbackScript()
            {
                String script = super.getCallbackScript().toString().replace( "\"__PLACEHOLDER__\"", "data" );
                return script;
            }
        } );
    

    You only need to pass the interaction url to the page on some moment. For this you can use renderHead in the component that has the behaviour:

        @Override
        public void renderHead( final IHeaderResponse response )
        {
     ...
                    //use the `setupCallback` to store the callback script somewhere.., I store it in 'interactionurl'
            String script = String.format(  " setupCallback(this.interactionbehavior.getCallbackScript()); "); 
            response.render( OnDomReadyHeaderItem.forScript( script ) 
        }