I want to know how I can show that write on my search box and appear in a rectangle inside map (sync up two elements, search box and the Text area).

Like this:

[link] (https://design.ateljekartan.com/?lat=40.4167754&lng=-3.7037902&zoom=15&text=Madrid&orientation=landscape&styleName=fullscreen-adriatic)


The main key here is to observe changes in your input box and then set new value on another element, i.e.:

$(document).on('change', 'input', function() {
  var newVal = $('input').val();

Here is a working example on Leaflet and jQuery, with a container created as an extension on map.


  • How I can get "Id" of my Mapbox style. In Codepen (link) you write "container.id", Where I can get this Id? Is it possible edit my own maps and create this Id? I have some problems with 'changed' in console. – Basi Montes Jun 14 '18 at 11:36
  • In this line I created the element id name: container.id = "divOnMap"; so that I could access it later with jQuery $('#divOnMap'). You can name it whatever you want. Feel free to play around with the codepen and change with your values – d324223 Jun 14 '18 at 11:40
  • Unexpected token ILLEGAL, result – Basi Montes Jun 14 '18 at 15:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.