##

Demos

Menu Search

Note: this page has not been updated after 1.3

## Question:

# How do I control page titles?

## Answer:

When you load the first page of a jQuery Mobile based site, then click a link or submit a form, Ajax is used to pull in the content of the requested page. Having both pages in the DOM is essential to enable the animated page transitions, but one downside of this approach is that the page title is always that of the first page, not the subsequent page you're viewing. To remedy this, jQuery Mobile automatically parses the `title` of the page pulled via Ajax and changes the `title` attribute of the parent document to match.

## Titles in multi-page templates

On multi-page documents, we follow a similar convention, but since all the pages share a common `title`, we have a `data-title` attribute that can be added to each page container within a multi-page template to manually define a title. The title of the HTML document will be automatically updated to match the `data-title` of the page currently in view.

    	<div data-role="page" id="foo" data-title="Page Foo">

    	</div><!-- /page -->

- Home
- Introduction
- Buttons
- Button widget

- ### Checkboxradio widget

  - Checkboxes
  - Radio buttons

- ### Collapsible (set) widget

  - Collapsible
  - Dynamic collapsibles
  - Collapsible set

- ### Controlgroup widget

  - Controlgroup
  - Dynamic controlgroups
- Datepicker

- ### Events

  - Swipe list items
  - Swipe page navigation
- Filterable widget
- Flipswitch widget

- ### Forms

  - Forms
  - Hide labels
  - Field containers
  - Forms disabled
  - Forms gallery

- ### Grids

  - Grids
  - Buttons in grids
  - Custom responsive grids
- Grouping and dividing content

- ### Icons

  - Icons
  - Grunticon loader

- ### Listview widget

  - Listview
  - Listview autocomplete
  - Listview autocomplete remote data
  - Listview autodividers linkbar
  - Listview autodividers selector
  - Listview Nested Listviews
  - Listview collapsible list items (flat)
  - Listview collapsible list items (indented)
  - Listview responsive grid
- Loader widget
- Navbar widget

- ### Navigation

  - Navigation
  - Linking pages
  - PHP redirect demo
  - Hash processing demo

- ### Pages

  - Pages
  - Single page
  - Multi-page template
  - Dialog page

- ### Panel widget

  - Panel
  - External panels
  - Fixed panels
  - Panels responsive
  - Custom panel style
  - Panel open on swipe
  - Panel external and internal

- ### Popup widget

  - Popup
  - Popup alignment
  - Popup arrow size
  - Dynamic popups
  - Popups with iframes
  - Popup image scaling
  - Popup outside multi-page
- Rangeslider widget
- Responsive Web Design

- ### Selectmenu widget

  - Selectmenu
  - Custom select menu
  - Custom select menu with filter

- ### Slider widget

  - Slider
  - Slider flip toggle switch
  - Slider tooltip

- ### Table widget

  - Table Column Toggle
  - Table Column Toggle demo
  - Table Column Toggle heading groups
  - Table Column Toggle options
  - Table Reflow
  - Table Reflow heading groups
  - Table Reflow stripes and strokes
  - Table Reflow custom styles
- Tabs widget
- Textinput widget

- ### Theming

  - Default theme
  - Classic theme

- ### Toolbar widget

  - Toolbar
  - Dynamic toolbars
  - External toolbars
  - Fixed toolbars
  - Fullscreen toolbars
  - Fixed external toolbars
  - Persistent toolbars
  - Ajax optimized toolbars
  - Form in toolbar
- Transitions

- ### 3rd party API demos

  - Backbone RequireJS
  - Google Maps geolocation
  - Google Maps list toggle

- Home
- Introduction
- Buttons
- Button widget

- ### Checkboxradio widget

  - Checkboxes
  - Radio buttons

- ### Collapsible (set) widget

  - Collapsible
  - Dynamic collapsibles
  - Collapsible set

- ### Controlgroup widget

  - Controlgroup
  - Dynamic controlgroups
- Datepicker

- ### Events

  - Swipe list items
  - Swipe page navigation
- Filterable widget
- Flipswitch widget

- ### Forms

  - Forms
  - Hide labels
  - Field containers
  - Forms disabled
  - Forms gallery

- ### Grids

  - Grids
  - Buttons in grids
  - Custom responsive grids
- Grouping and dividing content

- ### Icons

  - Icons
  - Grunticon loader

- ### Listview widget

  - Listview
  - Listview autocomplete
  - Listview autocomplete remote data
  - Listview autodividers linkbar
  - Listview autodividers selector
  - Listview Nested Listviews
  - Listview collapsible list items (flat)
  - Listview collapsible list items (indented)
  - Listview responsive grid
- Loader widget
- Navbar widget

- ### Navigation

  - Navigation
  - Linking pages
  - PHP redirect demo
  - Hash processing demo

- ### Pages

  - Pages
  - Single page
  - Multi-page template
  - Dialog page

- ### Panel widget

  - Panel
  - External panels
  - Fixed panels
  - Panels responsive
  - Custom panel style
  - Panel open on swipe
  - Panel external and internal

- ### Popup widget

  - Popup
  - Popup alignment
  - Popup arrow size
  - Dynamic popups
  - Popups with iframes
  - Popup image scaling
  - Popup outside multi-page
- Rangeslider widget
- Responsive Web Design

- ### Selectmenu widget

  - Selectmenu
  - Custom select menu
  - Custom select menu with filter

- ### Slider widget

  - Slider
  - Slider flip toggle switch
  - Slider tooltip

- ### Table widget

  - Table Column Toggle
  - Table Column Toggle demo
  - Table Column Toggle heading groups
  - Table Column Toggle options
  - Table Reflow
  - Table Reflow heading groups
  - Table Reflow stripes and strokes
  - Table Reflow custom styles
- Tabs widget
- Textinput widget

- ### Theming

  - Default theme
  - Classic theme

- ### Toolbar widget

  - Toolbar
  - Dynamic toolbars
  - External toolbars
  - Fixed toolbars
  - Fullscreen toolbars
  - Fixed external toolbars
  - Persistent toolbars
  - Ajax optimized toolbars
  - Form in toolbar
- Transitions

- ### 3rd party API demos

  - Backbone RequireJS
  - Google Maps geolocation
  - Google Maps list toggle