JQUERY MOBILE how append grid to collapsible jquery mobile - Net-Raft.com

Welcome aboard! We are happy you are here and wish you good net-raft!

Just a Web Code Solution
join us

How append grid to collapsible using jquery mobile ?


 454

Show ResultJQUERY MOBILE


1

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7, IE=EmulateIE9, IE=EDGE" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){

$( document ).on( "click", "#button1", function() {


$("#gridA").append('<div class="ui-grid-b"><div class="ui-block-a"><span>Column1</span></div><div class="ui-block-b"><span>Column2</span></div><div class="ui-block-c"><span>Column3</span></div></div>');


$("#gridA").append('<div class="ui-grid-b"><div class="ui-block-a"><span>Value1</span></div><div class="ui-block-b"><span>Value2</span></div><div class="ui-block-c"><span>Value3</span></div></div>');


});
});
</script>

</head>

<body>

<div data-role="page" id="pageone">
<div data-role="header">
<h1>jquery mobile</h1>
</div>
<div data-role="main" class="ui-content">

<button class="ui-btn ui-icon-lock ui-btn-icon-left" id="button1">Confirm</button>

<div data-role="collapsible" id="collapsible1">
<h4>Grid 1</h4>
<div id="gridA">

</div>
</div>

</div>
<div data-role="footer">
<h1>Footer</h1>
</div>
</div>

</body>

</html> 

By        
The power of the user (%)
80%

The most helpful JQUERY MOBILE solutions

How detect click jquery mobile button using jquery ?How detect click jquery mobile button using jquery ?JQUERY MOBILE

Click to see more ...

  461     71
How append grid to collapsible using jquery mobile ?How append grid to collapsible using jquery mobile ?JQUERY MOBILE

Click to see more ...

  454     55
change page using jquery mobilechange page using jquery mobileJQUERY MOBILE

Click to see more ...

  465     36
How write code jquery mobile using jquery ?How write code jquery mobile using jquery ?JQUERY MOBILE

Click to see more ...

  349     33
How tick jquery mobile checkboxradio using jquery ?How tick jquery mobile checkboxradio using jquery ?JQUERY MOBILE

Click to see more ...

  229     30
How change a page in jquery mobile ?How change a page in jquery mobile ?JQUERY MOBILE

Click to see more ...

  384     26
Welcome aboard!
We are happy you are here and
wish you good net-raft!