<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="./css/home.css" rel="stylesheet" type="text/css">
<script src="./js/jquery-2.1.4.js"></script>
</head>
<h1>Nybro</h1>
<body>
<nav class="navbar navbar-inverse bg-inverse navbar-static-top">
<div class="container-fluid">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="schools.html">Profile</a></li>
<li><a href="chats.html">Feedback</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="home.html">Sign Out</a></li>
</ul>
</div>
</nav>
<div class='container'>
<div class='nav-search'>
<div class='search-left'>
<a href='profile.php'>User Profile</a>
</div>
<div class='search-middle'>
<input class='ipt' name='tutor' placeholder="Input Course Code (i.e. CSE 131)" />
<button class='btn btn-primary' onclick='searchCondition()'>search</button>
</div>
<div class='search-right'>
<a href='login.php'>Logout</a>
</div>
</div>
<div class='main-content'>
</div>
</div>
<script>
searchCondition()
function searchCondition(){
var $tutor = $("input[name='tutor']").val();
$.ajax({
url:'./db/homedb.php',
type:"POST",
data:{
'tutor':$tutor
},
dataType:"JSON",
success:function(returnData){
if(returnData.length>0){
var html = '';
for(var i in returnData){
if( i % 3 == 0) {
html += "<div class='basic-row'>";
}
html += "<div class='basic'>";
html += "<p>Name: <span>"+returnData[i]['name']+"</span></p>";
html += "<p>Email: <span>"+returnData[i]['email']+"</span></p>";
html += "<p>Major: <span>"+returnData[i]['major']+"</span></p>";
html += "<p>Bio: <span>"+returnData[i]['bio']+"</span></p>";
html += "<p>Availability: <span>"+returnData[i]['availability']+"</span></p>";
html += "<p>Tutor: <span>"+returnData[i]['tutor']+"</span></p>";
html += "</div>";
if((i != 0) && ((i-2) % 3 == 0)) {
console.log(i)
html += "</div>";
}
}
$(".main-content").html(html);
}
else{
var html = '';
html += "<div class='basic'>";
html += html += "<p>There are no avaiabile tutors for this course</p>";
html += "</div>";
$(".main-content").html(html);
}
},error:function(e){
console.log(e)
}
})
}
</script>
</body>
</html>
body {
/*padding-top: 10px;*/
padding-bottom: 40px;
/*background-color: #eee;*/
/*background-image: url('https://vignette2.wikia.nocookie.net/clubpenguin/images/e/e9/Jess_Future_Party_Login_Screen_Background.png/revision/latest?cb=20160330140948');*/
background: #558C89; /* Old browsers */
/*background: -moz-radial-gradient(center, ellipse cover, #558C89 1%, #74AFAD 100%); */
/*background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(1%,#558C89), color-stop(100%,#74AFAD)); */
/*background: -webkit-radial-gradient(center, ellipse cover, #558C89 1%,#74AFAD 100%); */
/*background: -o-radial-gradient(center, ellipse cover, #558C89 1%,#74AFAD 100%); */
/*background: -ms-radial-gradient(center, ellipse cover, #558C89 1%,#74AFAD 100%); */
/*background: radial-gradient(ellipse at center, #558C89 1%,#74AFAD 100%); */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#558C89', endColorstr='#74AFAD',GradientType=1 ); */
/*height:calc(100vh);*/
/*width:100%;*/
}
h1 {
padding-left: 15px;
}
.picture {
border-radius: 8px;
padding: 10px 20px 10px;
width: 175px;
height: auto;
}
.information{
padding-left: 15px;
padding-right: 300px;
}
.navbar{
background-color:#D9853B;
border: 0;
}
.nav.navbar-nav.navbar-right,.nav.navbar-nav li a {
color: #fff;
}
ul li:hover {
background-color:#0000EE;
}
