Bootstrap modal dialog with ajax call
Neede JS files:
<link href='http://datatables.github.com/Plugins/integration/bootstrap/2/dataTables.bootstrap.css' rel="stylesheet">
<link href='http://nakupanda.github.io/bootstrap3-dialog/assets/bootstrap-dialog/css/bootstrap-dialog.css' rel="stylesheet">
<link href='<c:url value="/resources/css/bootstrap-datetimepicker.min.css"/>' rel="stylesheet">
<script src='http://datatables.net/release-datatables/media/js/jquery.js'></script>
<script src='http://datatables.net/release-datatables/media/js/jquery.dataTables.js'></script>
<script src='http://datatables.net/release-datatables/extras/TableTools/media/js/ZeroClipboard.js'></script>
<script src='http://datatables.net/release-datatables/extras/TableTools/media/js/TableTools.js'></script>
<script src='http://nakupanda.github.io/bootstrap3-dialog/assets/bootstrap/js/bootstrap.min.js'></script>
<script src='http://datatables.github.com/Plugins/integration/bootstrap/2/dataTables.bootstrap.js'></script>
<script src='<c:url value="/resources/js/bootstrap-datetimepicker.min.js"/>'></script>
<script src='http://nakupanda.github.io/bootstrap3-dialog/assets/bootstrap-dialog/js/bootstrap-dialog.js'></script>
*************************************************88
BootstrapDialog.show({
message: 'I send ajax request!',
buttons: [{
icon: 'glyphicon glyphicon-send',
label: 'Send ajax request',
cssClass: 'btn-primary',
autospin: true,
action: function(dialogRef){
dialogRef.enableButtons(false);
dialogRef.setClosable(false);
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
dialogRef.getModalBody().html(xmlhttp.responseText);
}
}
var ss = "<head></head>";
var d = new Date(2013, 11, 15, 03, 00, 00, 000);
alert(d);
xmlhttp.open("GET", "http://localhost:8080/BatchAdmin1/status/12&2013-11-22 03:05:00&3&0?fName=ss ", true);
xmlhttp.send();
setTimeout(function(){
dialogRef.close();
}, 7000);
}
}, {
label: 'Close',
action: function(dialogRef){
dialogRef.close();
}
}]
});
<link href='http://datatables.github.com/Plugins/integration/bootstrap/2/dataTables.bootstrap.css' rel="stylesheet">
<link href='http://nakupanda.github.io/bootstrap3-dialog/assets/bootstrap-dialog/css/bootstrap-dialog.css' rel="stylesheet">
<link href='<c:url value="/resources/css/bootstrap-datetimepicker.min.css"/>' rel="stylesheet">
<script src='http://datatables.net/release-datatables/media/js/jquery.js'></script>
<script src='http://datatables.net/release-datatables/media/js/jquery.dataTables.js'></script>
<script src='http://datatables.net/release-datatables/extras/TableTools/media/js/ZeroClipboard.js'></script>
<script src='http://datatables.net/release-datatables/extras/TableTools/media/js/TableTools.js'></script>
<script src='http://nakupanda.github.io/bootstrap3-dialog/assets/bootstrap/js/bootstrap.min.js'></script>
<script src='http://datatables.github.com/Plugins/integration/bootstrap/2/dataTables.bootstrap.js'></script>
<script src='<c:url value="/resources/js/bootstrap-datetimepicker.min.js"/>'></script>
<script src='http://nakupanda.github.io/bootstrap3-dialog/assets/bootstrap-dialog/js/bootstrap-dialog.js'></script>
*************************************************88
BootstrapDialog.show({
message: 'I send ajax request!',
buttons: [{
icon: 'glyphicon glyphicon-send',
label: 'Send ajax request',
cssClass: 'btn-primary',
autospin: true,
action: function(dialogRef){
dialogRef.enableButtons(false);
dialogRef.setClosable(false);
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
dialogRef.getModalBody().html(xmlhttp.responseText);
}
}
var ss = "<head></head>";
var d = new Date(2013, 11, 15, 03, 00, 00, 000);
alert(d);
xmlhttp.open("GET", "http://localhost:8080/BatchAdmin1/status/12&2013-11-22 03:05:00&3&0?fName=ss ", true);
xmlhttp.send();
setTimeout(function(){
dialogRef.close();
}, 7000);
}
}, {
label: 'Close',
action: function(dialogRef){
dialogRef.close();
}
}]
});
Comments
Post a Comment