<?php 
session_start();
ob_start();
include("../../pidbco/pidbjoin.php");
$sujpath="./";
?>
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Projects</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <!-- Bootstrap 3.3.5 -->
    <link rel="stylesheet" href="<?php echo $sujpath; ?>bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="<?php echo $sujpath; ?>font-awesome/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="<?php echo $sujpath; ?>font-awesome/ionicons.min.css">
    <!-- DataTables -->
    <link rel="stylesheet" href="<?php echo $sujpath; ?>plugins/datatables/dataTables.bootstrap.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="<?php echo $sujpath; ?>dist/css/AdminLTE.min.css">
    <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->
    <link rel="stylesheet" href="<?php echo $sujpath; ?>dist/css/skins/_all-skins.min.css">
    <script>
    function add_new_customer(){
             var vcompany = $('#vcompany').val();
             var vcontact = $('#vcontact').val();
             var vmob = $('#vmob').val();
             var vemail = $('#vemail').val();
             var vcountry = $('#vcountry').val();
             var vstate = $('#vstate').val();
             var vdistrict = $('#vdistrict').val();
             var vstatus = $('#vstatus').val();
             if(vcompany == ''){
                alert("Enter Company");   	
             } else if(vmob == ''){
             	alert("Enter Mobile");
             } else {                    
                  $.ajax({
                    type: "POST",
                    url: "ajaxmarket.php",
                     data: {
                          add_new_customer: 1,
                          vcompany     : vcompany,
                          vcontact     : vcontact,
                          vmob         : vmob,
                          vemail       : vemail,
                          vcountry     : vcountry,
                          vstate       : vstate,
                          vdistrict    : vdistrict,
                          vstatus      : vstatus
                     },
                     cache: true,
                     success: function(res23)
                     {
                     	   	$('#vcompany').val('');
                           	$('#vcontact').val('');
                           	$('#vmob').val('');
                           	$('#vemail').val('');
                           	$('#vcountry').val('');
                           	$('#vstate').val('');
                           	$('#vdistrict').val('');
                           	$("#marketingdiv123").load("customer.php #marketingdiv123");   
                            datat2();                    
                      }
                   }); 
    	    }
      }
    	
      function edit_new_customer()
      {
             var vcompany = $('#vcompany').val();
             var vcontact = $('#vcontact').val();
             var vmob = $('#vmob').val();
             var vemail = $('#vemail').val();
             var vcountry = $('#vcountry').val();
             var vstate = $('#vstate').val();
             var vdistrict = $('#vdistrict').val();
             var vstatus = $('#vstatus').val();
             var hidvall = $('#hidvall').val();
             
             if(vcompany == ''){
                alert("Enter Company");   	
             } else if(vmob == ''){
             	alert("Enter Mobile");
             } else {                    
                  $.ajax({
                    type: "POST",
                    url: "ajaxmarket.php",
                     data: {
                          edit_new_customer: 1,
                          vcompany     : vcompany,
                          vcontact     : vcontact,
                          vmob         : vmob,
                          vemail       : vemail,
                          vcountry     : vcountry,
                          vstate       : vstate,
                          vdistrict    : vdistrict,
                          vstatus      : vstatus,
                          hidvall      : hidvall
                     },
                     cache: true,
                     success: function(res23)
                     {
                     	   	$('#vcompany').val('');
                           	$('#vcontact').val('');
                           	$('#vmob').val('');
                           	$('#vemail').val('');
                           	$('#vcountry').val('');
                           	$('#vstate').val('');
                           	$('#vdistrict').val('');
                           	$("#marketingdiv123").load("customer.php #marketingdiv123");   
                            datat2();                    
                      }
                   }); 
    	    }

        }
    	function delete_customer(id)
    	{
    		var result = confirm("Want to delete?");
			if (result) 
			{
     		$.ajax({
			type: "POST",
			url: "ajaxmarket.php",
			data: {
			btn_delete_customers: 1,
			id:id
			},
			cache: true,
			success: function(res)
			{
			      $("#marketingdiv123").load("customer.php #marketingdiv123");
			      datat();
         	}  
			});
   			}
    	}
    	function edit_customer(id)
    	{
    		$.ajax({
			type: "POST",
			url: "ajaxmarket.php",
			data: {
			btn_edit_market: 1,
			id:id
			},
			cache: true,
			success: function(res)
			{
	         	$("#marketingdiv2").load("customer.php?idd2="+id+" #marketingdiv2"); 	
			}  
			});
    	}
function state_change(str)
{
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)
    {
    document.getElementById("vdistrict").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","ajaxmarket.php?state_idd="+str,true);
xmlhttp.send();
}
    </script>
    
    
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>    
 
    
  </head>
  <body class="hold-transition skin-blue sidebar-mini">
  	<div ng-app="myapp" ng-controller="empcontroller" ng-init="loadCountry()">
  		
  		
     <div class="wrapper">
  <?php include("head.php");
    include("left.php"); ?> 
	 
      <!-- Content Wrapper. Contains page content -->
      <div class="content-wrapper" >
        <!-- Content Header (Page header) -->
        <section class="content-header">
          <h1> Customers
          	<small>- Control panel</small>
          	</h1>
          <ol class="breadcrumb">
            <li><a href="dash_board.php"><i class="fa fa-dashboard"></i> Home</a></li>
            <li class="active">Customers</li> 
          </ol>
        </section>
  <!-- Main content -->
        <section class="content" >
          <div class="row" >
            <div class="col-xs-12" >





   <div class="box-body" id="marketingdiv2">
  <?php
      $idd2 = strip_tags(base64_decode($_GET['idd2']));
	  $sq = mysqli_query($con, "SELECT * FROM `p_customers` WHERE `cid`='$idd2' " );
	  $rs = mysqli_fetch_assoc($sq);	  
 ?>	 	

<form name="cform" id="cform" novalidate>
			  	
	<div class="box-body" >
 <div class="row" >	
<div class="col-md-12" style="" >
	
<div class="col-md-3"  style=" padding-left: 2px; padding-right: 0px; ">					
<div class="form-group">
	<input type="text" ng-model="ccompany" required name="vcompany" id="vcompany" class="form-control" placeholder="Company Name" value="<?php echo $rs['cname']; ?>"/>	
</div></div>

<div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
  <div class="form-group">
	<input type="text" ng-model="ccontact" name="vcontact" id="vcontact" class="form-control" placeholder="Contact Person" value="<?php echo $rs['ccontact']; ?>"/>	
 </div></div>
	
 <div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
  <div class="form-group">
	<input type="text" ng-model="cmob" name="vmob" id="vmob" class="form-control" placeholder="Mobile" value="<?php echo $rs['cmob']; ?>"/>	
 </div></div>	
 
  <div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
  <div class="form-group">
	<input type="text" ng-model="cemail" name="vemail" id="vemail" class="form-control" placeholder="Email" value="<?php echo $rs['cemail']; ?>"/>	
 </div></div>
 
 
  	</div>	
</div>	


<div class="row" >	
<div class="col-md-12" style="" >
	
	
<div class="col-md-3"  style=" padding-left: 2px; padding-right: 0px; ">
<div class="form-group">	
<select ng-model="ccountry" name="vcountry" id="vcountry" class="form-control" >
	<option value="" >Country</option>
	<option value="India" selected="selected">India</option>
	<option ng-repeat="country in countries" value="{{country.country_name}}">{{country.country_name}}</option> 
</select>
</div>	
</div>		
		
<div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">			
<div class="form-group">
  <select ng-model="cstate" class="form-control" id="vstate" name="vstate" onchange="state_change(this.value);">
  <option value="">State</option>
        <?php
        $stmt01 = mysqli_query($con,"SELECT * FROM `states` ");
        while($res01 = mysqli_fetch_array($stmt01)) {
        	if($rs['cstate'] == $res01['state_name']){ ?>
        <option value="<?php echo $res01['state_name']; ?>" selected><?php echo $res01['state_name']; ?></option>
	    <?php } else { ?>		 
         <option value="<?php echo $res01['state_name']; ?>"><?php echo $res01['state_name']; ?></option>
        <?php } } ?>
  </select> 
</div></div>


<div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
<div class="form-group">
    <select ng-model="cdistrict" class="form-control" id="vdistrict" name="vdistrict">
    <option value="">District</option>
     <?php 
     $dis = $rs['cdistrict'];
	 $sta = $rs['cstate'];
	 $stmt01 = mysqli_query($con,"SELECT * FROM `cities` WHERE `state_name`='$sta' ");
        while($res01 = mysqli_fetch_array($stmt01)) { 
        	if($res01['cities_name'] == $dis){ ?> 
        <option value="<?php echo $res01['cities_name']; ?>" selected><?php echo $res01['cities_name']; ?></option>	
        <?php } else { ?>	
        <option value="<?php echo $res01['cities_name']; ?>"><?php echo $res01['cities_name']; ?></option>		
       <?php } } ?>
    </select>
</div></div>


<div class="col-md-2" style=" padding-left: 2px; padding-right: 0px; ">					
<div class="form-group">
     <select ng-model="cststaus" name="vstatus" id="vstatus" class="form-control">
     	<option value="">Status</option>
  	<option value="1" <?php if($rs['cstatus'] == '1'){ ?> selected <?php } ?>>Active</option>
  	<option value="0" <?php if($rs['cstatus'] == '0'){ ?> selected <?php } ?>>InActive</option>  	
  </select>	
</div></div>

	

<div class="col-md-1"  style=" padding-left: 2px; padding-right: 0px; ">				
<div class="form-group">
  <?php if($idd2 != ''){ ?>
	<input type="hidden" name="hidvall" id="hidvall" value="<?php echo $rs['cid']; ?>" />
<input type="submit" class="btn btn-primary" name="frasubmit" id="frasubmit" value="Update" onclick="edit_new_customer();" style=" float: right;" />
<!--<input type="button" value="Submit" ng-click="updateData()" class="btn btn-primary" /> --> 

<?php } else { ?>
<!--<input type="submit" class="btn btn-primary" name="frasubmit" id="frasubmit" value="Submit" onclick="add_new_customer();" style=" float: right; 
margin-right: 20px; " /> -->
<input type="button" value="Submit" ng-click="insertData()" class="btn btn-primary" />	
<?php } ?> 
</div></div>

</div>




</div>



	
	

</div>

</form>

  </div>
  
  
  
  
  
  
<div id="marketingdiv123">


<div class="box" >
   <div class="box-body" style=" overflow: auto;">
        <div class="box-body table-responsive no-padding" >
   
  	                 	
                  <table id="example1" class="table table-bordered table-striped" >
                    <thead >
                    <tr >
<th>#</th>                    	
<th>Company</th>
<th>Contact Person</th>
<th>Mobile</th>
<th>State</th>
<th>Status</th>
<th></th>
</tr>
                    </thead>
                    <tbody>
<?php 
$sqq = mysqli_query($con, "SELECT * FROM `p_customers` ");
$p=1;
while($res = mysqli_fetch_assoc($sqq)){
?>
<tr>
	<td><?php echo $p; ?></td>
	<td><?php echo $res['cname']; ?></td>
	<td><?php echo $res['ccontact']; ?></td>
	<td><?php echo $res['cmob']; ?></td>
	<td><?php echo $res['cstate']; ?></td>
	<td><?php if($res['cstatus'] == '1'){ echo "Active"; } else { echo "InActive"; } ?></td>
	<td>
	&nbsp;  <a href="" data-toggle="modal" data-target="#myModal<?php echo $res['cid']; ?>" style=" cursor: pointer;"><span class="glyphicon glyphicon-eye-open" style="font-size:14px;"></span></a> &nbsp;                	
    <!-- <a onClick="edit_customer('<?php echo base64_encode($res['cid']); ?>');" style=" cursor: pointer;" ><span class="fa fa-pencil" style="font-size:14px;"></span></a> &nbsp; -->
    <a href="" data-toggle="modal" data-target="#my8Modal<?php echo $res['cid']; ?>" style=" cursor: pointer;"><span class="fa fa-pencil" style="font-size:14px;"></span></a> &nbsp;
    <a onClick="delete_customer('<?php echo base64_encode($res['cid']); ?>');" style=" cursor: pointer;" ><span class="fa fa-trash-o" style="font-size:14px;"></span></a> &nbsp;
	</td>
</tr>




<div class="modal fade" id="my8Modal<?php echo $res['cid']; ?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header" style=" background-color: #E8E8E8;">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Edit Customer Details</h4>
      </div>
  

        
        
        <div class="box-body" ng-app="myapp2" ng-controller="empcontroller2">
        	<form>
 <div class="row" >	
<div class="col-md-12" style="" >
	
<div class="col-md-3"  style=" padding-left: 2px; padding-right: 0px; ">					
<div class="form-group">
	<input type="text" ng-model="ccompany22" name="vcompany2" id="vcompany2" class="form-control" placeholder="Company Name" value="<?php echo $res["cname"]; ?>"/>	
</div></div>

<div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
  <div class="form-group">
	<input type="text" ng-model="ccontact22" name="vcontact" id="vcontact" class="form-control" placeholder="Contact Person" value="<?php echo $res['ccontact']; ?>"/>	
 </div></div>
	
 <div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
  <div class="form-group">
	<input type="text" ng-model="cmob22" name="vmob" id="vmob" class="form-control" placeholder="Mobile" value="<?php echo $res['cmob']; ?>"/>	
 </div></div>	
 
  <div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
  <div class="form-group">
	<input type="text" ng-model="cemail22" name="vemail" id="vemail" class="form-control" placeholder="Email" value="<?php echo $res['cemail']; ?>"/>	
 </div></div>
 
 
  	</div>	
</div>


<div class="row" >	
<div class="col-md-12" style="" >
	
	
<div class="col-md-3"  style=" padding-left: 2px; padding-right: 0px; ">
<div class="form-group">	
<select ng-model="ccountry22" name="vcountry" id="vcountry" class="form-control" >
	<option value="" >Country</option>
	<?php
	$sq2 = mysqli_query($con,"SELECT id,country_name FROM `countries` ");
	while($res2 = mysqli_fetch_array($sq2)){
	if($res2['country_name'] == 'India'){ ?>	
	<option value="<?php echo $res2['country_name']; ?>" selected="selected"><?php echo ucfirst($res2['country_name']); ?></option>
	<?php } else if($res['ccountry'] == $res2['country_name']) { ?>
	<option value="<?php echo $res2['country_name']; ?>" selected><?php echo ucfirst($res2['country_name']); ?></option>
	<?php } else { ?>
	<option value="<?php echo $res2['country_name']; ?>" ><?php echo ucfirst($res2['country_name']); ?></option>
    <?php } } ?>
</select>
</div>	
</div>		
		
<div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">			
<div class="form-group">
  <select ng-model="cstate22" class="form-control" id="vstate" name="vstate" onchange="state_change(this.value);">
  <option value="">State</option>
        <?php
        $stmt01 = mysqli_query($con,"SELECT * FROM `states` ");
        while($res01 = mysqli_fetch_array($stmt01)) {
        	if($res['cstate'] == $res01['state_name']){ ?>
        <option value="<?php echo $res01['state_name']; ?>" selected><?php echo $res01['state_name']; ?></option>
	    <?php } else { ?>		 
         <option value="<?php echo $res01['state_name']; ?>"><?php echo $res01['state_name']; ?></option>
        <?php } } ?>
  </select> 
</div></div>


<div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
<div class="form-group">
    <select ng-model="cdistrict22" class="form-control" id="vdistrict" name="vdistrict">
    <option value="">District</option>
     <?php 
     $dis = $res['cdistrict'];
	 $sta = $res['cstate'];
	 $stmt01 = mysqli_query($con,"SELECT * FROM `cities` WHERE `state_name`='$sta' ");
        while($res01 = mysqli_fetch_array($stmt01)) { 
        	if($res01['cities_name'] == $dis){ ?> 
        <option value="<?php echo $res01['cities_name']; ?>" selected><?php echo $res01['cities_name']; ?></option>	
        <?php } else { ?>	
        <option value="<?php echo $res01['cities_name']; ?>"><?php echo $res01['cities_name']; ?></option>		
       <?php } } ?>
    </select>
</div></div>


<div class="col-md-3" style=" padding-left: 2px; padding-right: 0px; ">					
<div class="form-group">
     <select ng-model="cststaus22" name="vstatus" id="vstatus" class="form-control">
     	<option value="">Status</option>
  	<option value="1" <?php if($res['cstatus'] == '1'){ ?> selected <?php } ?>>Active</option>
  	<option value="0" <?php if($res['cstatus'] == '0'){ ?> selected <?php } ?>>InActive</option>  	
  </select>	
</div></div>

	

<div class="col-md-2"  style=" float: right;">				
<div class="form-group">
<input type="hidden" ng-model="hidvall22" name="hidvall22" id="hidvall22" value="<?php echo $res['cid']; ?>" />
<!--<input type="submit" class="btn btn-primary" name="frasubmit" id="frasubmit" value="Update" onclick="edit_new_customer();" style=" float: right;" />-->
<input type="button" value="Update" ng-click="updateData()" class="btn btn-primary" /> 
</div></div>


</div></div>
	
</form>
</div>


  
  
  
  
  
  
  
      
      
    </div>
  </div>
</div>  






<div class="modal fade" id="myModal<?php echo $res['cid']; ?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header" style=" background-color: #E8E8E8;">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Customer Details</h4>
      </div>
      <div class="modal-body" id="myModal2">
  
 <div style=" width:550px; ">
  <div style=" float:left; width:150px;  font-size:14px; color:#0000FF; ">Company Name</div><div style="width:375px; ">: &nbsp;&nbsp; <?php echo $res["cname"]; ?></div>
  <div style=" float:left; width:150px;font-size:14px;color:#0000FF;">Contact Person </div><div style="width:375px;">: &nbsp;&nbsp; <?php echo $res["ccontact"]; ?></div>
  <div style=" float:left; width:150px;font-size:14px;color:#0000FF;">Mobile </div><div style="width:375px;">: &nbsp;&nbsp; <?php echo $res["cmob"]; ?></div>
  <div style=" float:left; width:150px;font-size:14px;color:#0000FF;">Email </div><div style="width:375px;">: &nbsp;&nbsp; <?php echo $res["cemail"]; ?></div>
  <div style=" float:left; width:150px;font-size:14px;color:#0000FF;">Country </div><div style="width:375px;">: &nbsp;&nbsp; <?php echo $res["ccountry"]; ?></div>
  <div style=" float:left; width:150px;font-size:14px;color:#0000FF;">State </div><div style="width:375px;">: &nbsp;&nbsp; <?php echo $res["cstate"]; ?></div>
  <div style=" float:left; width:150px;font-size:14px;color:#0000FF;">District </div><div style="width:375px;">: &nbsp;&nbsp; <?php echo $res["cdistrict"]; ?></div>
  <div style=" float:left; width:150px;font-size:14px;color:#0000FF;">Status </div><div style="width:375px;">: &nbsp;&nbsp; <?php if($res["cstatus"] == '1'){ echo "Active"; } else { echo "InActive"; } ?></div>
  
 </div>
  
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
       
      </div>
    </div>
  </div>
</div>   
<?php $p=$p+1; } ?>
                    </tbody>
                    </table>
  
         		  </div>
                </div><!-- /.box-body -->
              </div><!-- /.box -->
	
	
</div>
	
		
			
			
			
                      
            </div><!-- /.col -->
          </div><!-- /.row -->
        </section><!-- /.content -->
  </div><!-- /.content-wrapper -->
  </div>
	
	
	
	
	</div>
	
	
<script>
  var app = angular.module('myapp',[]);
      app.controller('empcontroller',function($scope,$http){	
      	
     $scope.loadCountry = function(){  
           $http.get("ajaxmarket2.php")  
           .success(function(data){  
           	    $scope.countries = data;
               // $scope.ccountry = $scope.data[3];
               // $scope.ccountry = $scope.JSON.countries[1];
               //$scope.ccountry = $scope.countries[1];
           })  
      }  
      	
      	
      	
      	
      $scope.insertData=function(){
        if (($scope.ccompany == undefined) || ($scope.ccompany == '')) {
    		alert("Enter Company Name");
    	} else if (($scope.ccontact == undefined) || ($scope.ccontact == '')) {
    		alert("Enter Contact Person");
    	} else if (($scope.cmob == undefined) || ($scope.cmob == '')) {
    		alert("Enter Mobile");
    	} else {	
    	var custreg = 1;	
    $http.post("ajaxmarket2.php", {
    	'custreg'  :custreg,
		'ccompany' :$scope.ccompany,
		'ccontact' :$scope.ccontact,
		'cmob'     :$scope.cmob,
		'cemail'   :$scope.cemail,
		'ccountry' :$scope.ccountry,
		'cstate'   :$scope.cstate,
		'cdistrict':$scope.cdistrict,
		'cststaus' :$scope.cststaus})
    .success(function(data,status,headers,config){
    	$('#cform')[0].reset();
    	$("#marketingdiv123").load("customer.php #marketingdiv123");   
        datat2();
    });
    } }
  });
  </script>
  
 
	
 <!-- jQuery 2.1.4 -->
    <script src="<?php echo $sujpath; ?>plugins/jQuery/jQuery-2.1.4.min.js"></script>
    <!-- Bootstrap 3.3.5 -->
    <script src="<?php echo $sujpath; ?>bootstrap/js/bootstrap.min.js"></script>
    <!-- DataTables -->
	<script src="<?php echo $sujpath; ?>plugins/datatables/jquery.dataTables.min.js"></script>
    <script src="<?php echo $sujpath; ?>plugins/datatables/dataTables.bootstrap.min.js"></script>
    <!-- SlimScroll -->
    <script src="<?php echo $sujpath; ?>plugins/slimScroll/jquery.slimscroll.min.js"></script>
    <!-- FastClick -->
    <script src="<?php echo $sujpath; ?>plugins/fastclick/fastclick.min.js"></script>
    <!-- AdminLTE App -->
    <script src="<?php echo $sujpath; ?>dist/js/app.min.js"></script>
    <!-- AdminLTE for demo purposes -->
    <script src="<?php echo $sujpath; ?>dist/js/demo.js"></script>
    <!-- page script -->
    
  <script type="text/javascript">
    function PreviewImage(no) {
    	var oFReader = new FileReader();
        oFReader.readAsDataURL(document.getElementById("uploadImage"+no).files[0]);
        oFReader.onload = function (oFREvent) {
            document.getElementById("uploadPreview"+no).src = oFREvent.target.result;
        };
    }
</script>

<style>
label.filebutton {
    width:120px;
    height:80px;
    overflow:hidden;
    position:relative;
}
label span input {
    z-index: 999;
    line-height: 0;
    font-size: 50px;
    position: absolute;
    top: -2px;
    left: -700px;
    opacity: 0;
    filter: alpha(opacity = 0);
    -ms-filter: "alpha(opacity=0)";
    cursor: pointer;
    _cursor: hand;
    margin: 0;
    padding:0;
}
</style>



    <script>
      $(document).ready(function() {
        $("#example1").DataTable();
      });
      
	function datat(){
	  alert("Data Deleted Successfully.");
      $(document).ready(function() {
        $("#example1").DataTable();
       
      });
    }
    function datat2(){
	  alert("Data Added Successfully");
      $(document).ready(function() {
        $("#example1").DataTable();
       
      });
    }
    function datat3(){
	  alert("Updated Successfully");
      $(document).ready(function() {
        $("#example1").DataTable();
       
      });
    }
   </script>  
   
   
   
  </body>
</html>
