O'Reilly logo

Bootstrap for Rails by Syed Fazle Rahman

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Fetching remote content from a Bootstrap modal

Here, data-remote is a special data attribute in Bootstrap's modal component. It is used to load a remote web page inside a modal, when data is triggered. This feature is only available from Bootstrap v 3.0 to v 3.2.0; I believe it is really very useful!

Let's check out an example of how to use it.

Let's create a new HTML page named page2.html inside the same Bootstrap Model project folder. Place the following basic HTML inside it:

<!DOCTYPE html>
<html>
  <head>
    <title>Page 2</title>
  </head>
  <body>
    <div class="container">
      <h1>Hello World from Page 2</h1>
    </div>
  </body>
</html>

This page should look like the following in a browser:

We will now load this page inside our previous modal, whenever it is triggered. ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required