Using HTML5 data attributes

HTML5 introduces data-* attributes for passing data about a specific HTML element from the webserver to JavaScript and CSS. In this recipe, we will see a way to attach data efficiently from Django to custom HTML5 data attributes and then describe how to read the data from JavaScript with a practical example: we will render a Google Map with a marker at a specified geographical position; when we click on the marker, we will display the address in an information window.

Getting ready

To get ready, follow these steps:

1. Use a PostgreSQL database with a PostGIS extension for this and the following chapters. To see how to install the PostGIS extension, look at the official documentation at https://docs...