Directory

paper-input-place component

Integration of paper-input-place (Google autocomplete place API) component for Vaadin 17

View larger

Close

Integration of paper-input-place component for Vaadin 17, using the autocomplete places java script API.

Sample code

      FlexLayout div = new FlexLayout();
        div.getStyle().set("flex-direction", "column");
        div.add(new Label("Paper input place by google api"));
        
        PaperInputPlace inputPlace = new PaperInputPlace("API-KEY");
        inputPlace.setCountry("DE");
        final Label selectedValueLabel = new Label("place selected");
        div.add(inputPlace, selectedValueLabel);
        
        inputPlace.addChangePlacejsonCompleteEventListener(e -> {
            selectedValueLabel.setText(e.getSource().getPlace());
            //e.getSource().getPlace() == { "place": {"name":"Korschenbroicher Straße 605, Mönchengladbach, Germany","latLng":{"lat":51.1949039 ,"long":6.4862356}}}
        });
        
        add(div);

Links

• View on GitHub

Compatibility