Add button to control group

Description

The following code shows how to add button to control group.

Example


<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'
  src='http://code.jquery.com/jquery-1.9.1.js'></script>
<script type='text/javascript'
  src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<link rel="stylesheet" type="text/css"
  href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css">
<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){<!--from ww w  .ja v  a  2s .c o m-->
$("#append").on("click", function () {
    $el = $("<a href='#' data-role='button'data-iconpos='notext' data-icon='grid'>Details</a>");
    $("#my-controlgroup").controlgroup("container")["append"]($el);
    $el.button();
    $("#my-controlgroup").controlgroup("refresh");
});
});//]]>  
</script>
</head>
<body>
<body>
  <div data-role="controlgroup" id="my-controlgroup"
    data-type="horizontal">
    <a href='#' data-role='button' data-iconpos='notext' data-icon='grid'
      class='details'>Details</a>
  </div>
  <button id="append" data-role="button" data-mini="true"
    data-inline="true">Append</button>
</body>
</body>
</html>

Click to view the demo

Add button to control group

Description

Example

Button

Button Event

Button Icon

Button Text

Checkbox

Collapsible

Date

Dialog

Event

Footer

Form

Header

Icon

Input

Layout

Listview

Listview Divider

Listview Item

Loader

mobile_settings

Navbar

Page

Page Event

Popup

Radio

Select

Slider

Switch

Textarea

Theme