newline in Leaflet marker popup text
<p>I have a form to associate some text to a marker on a Leaflet map:</p>

<pre><code>&lt;form action="map.php" method="POST"&gt;
 &lt;section&gt;
  &lt;label&gt;write some text here&lt;/label&gt;
   &lt;textarea id="text" rows="3" name="area"&gt;&lt;/textarea&gt;
 &lt;/section&gt;

 &lt;input type="submit" value="show map" /&gt;
&lt;/form&gt;
</code></pre>

<p>As you can see above, the content of the textarea is passed to the page map.php, where a map is shown.
On the map, the place marker is shown, and a popup contains the text posted through the textarea (variable <code>$text</code>):</p>

<pre><code>&lt;?php
$text = htmlspecialchars($_POST["text"]);
?&gt;

&lt;center&gt;
 &lt;div id="map" class="embed-container"&gt;&lt;/div&gt;
&lt;/center&gt;

&lt;script&gt;
  var map = L.map('map').setView([46.13, 11.11], 9);
  L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
    {
      attribution: '&amp;copy; &lt;a href="http://www.openstreetmap.org/copyright"&gt;OpenStreetMap&lt;/a&gt;',
      maxZoom: 17,
      minZoom: 9
    }).addTo(map);
&lt;/script&gt;
&lt;script&gt;
  var icon = L.icon({
        iconUrl: 'img/gps.png',
        iconSize: [25, 25],
        });
  var marker = L.marker(['&lt;?=$latitude;?&gt;', '&lt;?=$longitude;?&gt;'], {icon: icon}).addTo(map);
  marker.bindPopup('&lt;?=$text;?&gt;');
&lt;/script&gt;
</code></pre>

<p>The problem is that if I press <strong>ENTER</strong> while I write something in the textarea, nothing is passed to the popup marker.
I tried with <strong>\n</strong> and such, but nothing works. They are shown in the popup text as strings, not as newlines.</p>

<p>Any ideas?</p>