VeeeneX · January 20, 2016 14:43
diff --git a/index.php b/index.php
 <?php

 $sql = "SELECT doctorid, FIRST_NAME,LAST_NAME, Address, Qualification, Specialization, Consultation_Fee, Experience,image_path from t_doctorprofile";
 $results = mysqli_query($db,$sql) or die('MySQL Error');

 ?>
 <!DOCTYPE html>
 <html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <h3 style="color:#674172;margin-left:120px;float:center;display:inline-block"><strong>Available Dentists</strong></h3>
    
    <?php foreach($results as $key => $result): ?>
    
    	<?php echo $result['FIRST_NAME'] ?> <?php echo $result['LAST_NAME'] ?>
    	<br>
    	<div><a href="#myModal" data-toggle="modal" id="<?php echo $result['doctorid'] ?>" data-target="#edit-modal">Make appointment <?php echo $result['doctorid'] ?></a></div>

    <?php endforeach; ?>

 	<div id="edit-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Modal title</h4>
                </div>
                <div class="modal-body edit-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>
            </div>
        </div>
    </div>

    <!-- jquery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
 	<script>
        $('#edit-modal').on('show.bs.modal', function(e) {
            
            var $modal = $(this),
                doctorId = e.relatedTarget.id;
            
           $.ajax({
               cache: false,
               type: 'POST',
               url: 'backend.php',
               data: 'doctorid='+doctorId,
               success: function(data) {
                  $modal.find('.edit-content').html(data);
               }
           });
            
        });
    </script>
  </body>
 </html>
	<?php

	$sql = "SELECT doctorid, FIRST_NAME,LAST_NAME, Address, Qualification, Specialization, Consultation_Fee, Experience,image_path from t_doctorprofile";
	$results = mysqli_query($db,$sql) or die('MySQL Error');

	?>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- The above 3 meta tags must come first in the head; any other head content must come after these tags -->
	<title>Bootstrap 101 Template</title>

	<!-- Bootstrap -->
	<link href="css/bootstrap.min.css" rel="stylesheet">

	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->
	</head>
	<body>
	<h3 style="color:#674172;margin-left:120px;float:center;display:inline-block"><strong>Available Dentists</strong></h3>

	<?php foreach($results as $key => $result): ?>

	<?php echo $result['FIRST_NAME'] ?> <?php echo $result['LAST_NAME'] ?>
	<br>
	<div><a href="#myModal" data-toggle="modal" id="<?php echo $result['doctorid'] ?>" data-target="#edit-modal">Make appointment <?php echo $result['doctorid'] ?></a></div>

	<?php endforeach; ?>

	<div id="edit-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
	<div class="modal-content">
	<div class="modal-header">
	<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
	<h4 class="modal-title" id="myModalLabel">Modal title</h4>
	</div>
	<div class="modal-body edit-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>
	</div>
	</div>
	</div>

	<!-- jquery (necessary for Bootstrap's JavaScript plugins) -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script src="js/bootstrap.min.js"></script>
	<script>
	$('#edit-modal').on('show.bs.modal', function(e) {

	var $modal = $(this),
	doctorId = e.relatedTarget.id;

	$.ajax({
	cache: false,
	type: 'POST',
	url: 'backend.php',
	data: 'doctorid='+doctorId,
	success: function(data) {
	$modal.find('.edit-content').html(data);
	}
	});

	});
	</script>
	</body>
	</html>