问题描述:

Iam having code with two dialogs one from another, while going back from second dialog to first i have given data-transition as slide but it is not working. Can someone help me please thanks.

Here is the code

 <!DOCTYPE html>

<html>

<head>

<meta charset=utf-8 />

<meta name="viewport" content="width=device-width, initial-scale="1"">

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />

<link rel="stylesheet" type="text/css" href="http://dev.jtsage.com/cdn/simpledialog/latest/jquery.mobile.simpledialog.min.css" />

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>

<script type="text/javascript" src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>

<script type="text/javascript" src="http://dev.jtsage.com/cdn/simpledialog/latest/jquery.mobile.simpledialog2.min.js"></script>

<style>

.ui-simpledialog-screen-modal{

opacity: 0.4;

}

.ui-simpledialog-container {

border: 1px solid rgb(221, 221, 221) !important;

}

.ui-grid-a > div {

padding: 2px;

}

</style>

<script>

$(document).on("pagecreate", "#page1", function () {

$(document).on('click', '#openPopup', function() {

$('#inlinecontent').simpledialog2({

mode: "blank",

headerText: "Select Item(s)",

headerClose: false,

blankContent: true,

themeDialog: 'a',

width: '75%',

zindex: 1000

});

});

$(document).on('click', '#dialogSubmit', function() {

var numChecked = $('#cBoxes').find('[type=checkbox]:checked').length;

if (numChecked > 0){

$(document).trigger('simpledialog', {'method':'close'});

} else {

$('<div>').simpledialog2({

mode: 'blank',

headerText: 'Warning',

headerClose: true,

transition: 'flip',

themeDialog: 'b',

zindex: 2000,

blankContent :

"<div style='padding: 15px;'><p>Please select at least one checkbox first.</p>"+

// NOTE: the use of rel="close" causes this button to close the dialog.

"<a rel='close' data-role='button' href='#'>OK</a></div>"

});

}

});

});

</script>

</head>

<body>

<!-- the page markup -->

<div data-role="page" id="page1">

<div data-role="header" data-position="fixed">

<h1>SimpleDialog2 Chained Popup</h1>

</div>

<div class="ui-content" role="main">

<!-- button that opens the popup -->

<button id="openPopup">Select One or More Item(s)...</button>

</div>

</div>

<!-- the popup markup -->

<div id="inlinecontent" style="display:none" >

<div style="padding: 15px;">

<fieldset id="cBoxes" data-role="controlgroup" >

<legend>Favorite Fruit:</legend>

<input type="checkbox" name="checkbox-v-2a" id="checkbox-v-2a" />

<label for="checkbox-v-2a">Apple</label>

<input type="checkbox" name="checkbox-v-2b" id="checkbox-v-2b" />

<label for="checkbox-v-2b">Banana</label>

<input type="checkbox" name="checkbox-v-2c" id="checkbox-v-2c" />

<label for="checkbox-v-2c">Orange</label>

</fieldset>

<div class="ui-grid-a">

<div class="ui-block-a"><button id="dialogSubmit" data-theme="b">OK</button></div>

<div class="ui-block-b"><button id="dialogCancel" rel='close'>Cancel</button></div>

</div>

</div>

</div>

</body>

</html>

相关阅读:
Top