<script>
function modalFunction(val){
var userValue = document.getElementById(val).innerHTML;
alert(userValue);
var ajaxURL = "patientViewModalLoad.do";
$.ajax({
/* async:false, */
url : ajaxURL,
success : function(result) {
$("#patView_modalcall").html(result);
},
complete:function(){
/* $("#PGSCCModal").modal({
backdrop:'static',
show:true
}); */
$("#PGSCCModal").modal('show');
dataTableInitializationPatientViewPAT();
}
});
}
</script>
/* async:false, */ need for more data load at a time pop up open
/* $("#PGSCCModal").modal({
backdrop:'static',
show:true
}); */ need when click outside then pop up close
SO,
<script>
function modalFunction(val){
var userValue = document.getElementById(val).innerHTML;
alert(userValue);
var ajaxURL = "patientViewModalLoad.do";
$.ajax({
async:false,
url : ajaxURL,
success : function(result) {
$("
#patView_modalcall").html(result);
},
complete:function(){
$("
#PGSCCModal").modal({
backdrop:'static',
show:true
});
dataTableInitializationPatientViewPAT();
}
});
}
</script>
Jsp page :
<div id="
PGSCCModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div id="
patView_modalcall" class="modal-content">
here include modal contain(head, body and footer) thats means azax page
</div>
</div>
</div>
here include modal contain(head, body and footer) thats means azax page :
<%@ page language="java" contentType="text/html; charset=UTF-8" %>
<%@taglib prefix="s" uri="/struts-tags" %>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">× </button>
<h4 class="modal-title" id="myModalLabel">Patient View List</h4>
</div>
<div class="modal-body">
<!-- START PAGE CONTENT-->
<!-- BEGIN EXAMPLE TABLE widget-->
<div class="widget red">
<div class="widget-title">
<h4><i class="icon-reorder"></i> Data Table</h4>
<!--span class="tools">
<a href="javascript:;" class="icon-chevron-down"></a>
<a href="javascript:;" class="icon-remove"></a>
</span-->
</div>
<div class="widget-body">
<table class="table table-striped table-bordered" id="patViewDataTable3">
<thead>
<tr>
<th style="text-align:center;">HN Number</th>
<th style="text-align:center;">Patient Name</th>
<th style="text-align:center;">Age </th>
<th style="text-align:center;">Current Problem</th>
<th style="text-align:center;">Last Visit</th>
<th style="text-align:center;">Details</th>
<th style="text-align:center;">Preview</th>
</tr>
</thead>
<tbody>
<s:iterator value="patientViewList" status="rowstatus">
<tr class="odd gradeX">
<td><s:property value='reg_no'/></td>
<td><s:property value='full_name'/></td>
<td><s:property value='patient'/></td>
<td><s:property value='pname'/></td>
<td><s:property value='kkk'/></td>
<td><s:property value='kkk'/></td>
<td style="text-align:center;"><a href="#" ><i class="icon-print"></i></a></td>
</tr>
</s:iterator>
</tbody>
</table>
</div>
</div>
<!-- END EXAMPLE TABLE widget-->
<!-- END PAGE CONTENT-->
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
dataTableInitializationPatientViewPAT(); is use for table initialize
<script type="text/javascript">
// $(document).ready(function (){
// dataTableInitializationPatientViewPAT();
// });
function dataTableInitializationPatientViewPAT() {
var asInitVals = new Array();
var oTable = $('#patViewDataTable3').dataTable({
/*"oLanguage": {
"sSearch": "Search all: "
}*/
"bDestroy" : true,
"autoWidth" : false,
"bScrollCollapse" : true,
"bProcessing" : true,
"bJQueryUI" : true
});
$("thead input").keyup(function() {
/* Filter on the column (the index) of this element */
oTable.fnFilter(this.value,$("thead input").index(this));
});
/*
* Support functions to provide a little bit of 'user friendlyness' to the textboxes in
* the footer
*/
$("thead input").each(function(i) {
asInitVals[i] = this.value;
});
$("thead input").focus(function() {
if (this.className == "search_init") {
this.className = "";
this.value = "";
}
});
$("thead input").blur(function(i) {
if (this.value == "") {
this.className = "search_init";
this.value = asInitVals[$("thead input").index(this)];
}
});
}
</script>
