Untitled

<?php
	// thông tin mysql
	$servername = "127.0.0.1";
	$username = "root";
	$password = "";
	$dbname = "king";
	//tạo kết nối
	$ketnoi = new mysqli($servername,$username,$password,$dbname);
	//kiểm tra kết nối
	if($ketnoi->connect_error){
		echo ("Kết nối không thành công". $ketnoi->connect_error);
	}
?>
<!DOCTYPE html>
<html>
	<head>
			<title>Test</title>
			<meta name="viewport" content="width=device-width, initial-scale=1">
			<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
			<link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
			<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
			<link rel="stylesheet" type="text/css" href="style.css"/>
			<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
			<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	</head>

	<body style="padding: 15px;">
	<!-- menu -->
		<nav class="w3-sidenav w3-green" style="width:67px;height:68px;">
		  <a class="w3-padding-16" href="#"><i class="fa fa-home w3-xxlarge"></i></a>
		</nav>

	<table class="w3-table w3-striped w3-bordered w3-border phim w3-animate-left">
	<tr>
		<th style="padding: 16px;">Hình Ảnh</th>
		<th style="padding: 16px;">Tên Phim (Ấn vào tên phim để xem)</th>
		<th style="padding: 16px;">Thời Gian</th>
		<th style="padding: 16px;">Người Đăng</th>
		<th style="padding: 16px;">Ngày Đăng</th>
	</tr>
	<?php
	$sql = "SELECT id, hinhanh, ten, ho, mail, reg_date FROM thongtin ORDER BY id DESC";
	$result = $ketnoi->query($sql);

	if ($result->num_rows > 0) {
		while($row = $result->fetch_assoc()) {
			echo "<tr>
						<td><p class='w3-tooltip text-center'>
							<span style='position:absolute;left:1;bottom:20px;background-color:transparent;' class='w3-text w3-tag'>
								<img class='hinhanhimg' src='". " ".$row['hinhanh']."'/>
							</span>
							<span class='glyphicon glyphicon-picture'></span>
							</p>
						</td>
						<td><span class='glyphicon glyphicon-pause'></span><a data-toggle='modal' data-target='#myModal'>"." ".$row['ten']."</a></td>
						<td><span class='glyphicon glyphicon-facetime-video'></span>"." ".$row['ho']."</td>
						<td><span class='glyphicon glyphicon-user'></span>"." ".$row['mail']."</td>
						<td><span class='glyphicon glyphicon-edit'></span>"." ".$row['reg_date']."</td>
				</tr>";
		}
	} else {
		echo "0 results";
	}
	$ketnoi->close();
	?>
	</table>

	<!-- Modal -->
	<div class="modal fade" id="myModal" role="dialog">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
				  <button type="button" class="close" data-dismiss="modal">&times;</button>
				  <h4 class="modal-title text-center">Tên Phim</h4>
				</div>
				<div class="modal-body">
					còn ở modal này nè ~,.,~
					help me!!!
				</div>
				<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
				</div>
			</div>
		</div>
	</div>

	<!-- script -->
		<script>
			$(document).ready(function(){
				$('[data-toggle="tooltip"]').tooltip();
			});
		</script>

		<script>
		function myFunction() {
		  var input, filter, table, tr, td, i;
		  input = document.getElementById("o-search");
		  filter = input.value.toUpperCase();
		  table = document.getElementById("search");
		  tr = table.getElementsByTagName("tr");
		  for (i = 0; i < tr.length; i++) {
			td = tr[i].getElementsByTagName("td")[0];
			if (td) {
			  if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
				tr[i].style.display = "";
			  } else {
				tr[i].style.display = "none";
			  }
			}
		  }
		}
		</script>
	</body>
</html>