I am stuck in converting the login type of this web based application..I got the code from the net in which the app just ask for username and when we enter it, it shows the conversation page..But I want to convert that login type to a proper one like with a username and a password..I previously designed a login system which I want to use..the codes are absolutely working when used individually..when combined they wont work..can someone tell me the code after combining these two?
here's the code for app which is index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Chat</title>
<link type="text/css" rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="css/style.css">
<style>
a:link {
color: black;
}
a:visited {
color: black;
}</style>
</head>
<body>
<?php
session_start();
?>
<div id="wrapper">
<div id="menu">
<p class="welcome">Welcome, <b><?php echo $_SESSION['name']; ?></b></p>
<p class="logout"><a id="exit" href="login.php">Exit Chat</a></p>
<div style="clear:both"></div>
</div>
<div id="chatbox"></div>
<form name="message" action="">
<input name="usermsg" type="text" id="usermsg" size="63" />
<input name="submitmsg" type="submit" id="submitmsg" value="Send" />
</form>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
// jQuery Document
$(document).ready(function(){
//If user submits the form
$("#submitmsg").click(function(){
var clientmsg = $("#usermsg").val();
$.post("post.php", {text: clientmsg});
$("#usermsg").attr("value", "");
return false;
});
//Load the file containing the chat log
function loadLog(){
$.ajax({
url: "log.html",
cache: false,
success: function(html){
$("#chatbox").html(html); //Insert chat log into the #chatbox div
},
});
}
//Load the file containing the chat log
function loadLog(){
var oldscrollHeight = $("#chatbox").attr("scrollHeight") - 20; //Scroll height before the request
$.ajax({
url: "log.html",
cache: false,
success: function(html){
$("#chatbox").html(html); //Insert chat log into the #chatbox div
//Auto-scroll
var newscrollHeight = $("#chatbox").attr("scrollHeight") - 20; //Scroll height after the request
if(newscrollHeight > oldscrollHeight){
$("#chatbox").animate({ scrollTop: newscrollHeight }, 'normal'); //Autoscroll to bottom of div
}
},
});
}
setInterval (loadLog, 2500); //Reload file every 2500 ms or x ms if you w
});
</script>
<script type="text/javascript">
// jQuery Document
$(document).ready(function(){
//If user wants to end session
$("#exit").click(function(){
var exit = confirm("Are you sure you want to end the session?");
if(exit==true){window.location = 'index.php?logout=true';}
});
});
</script>
<?php
if(isset($_GET['logout'])){
//Simple exit message
$fp = fopen("log.html", 'a');
fwrite($fp, "<div class='msgln'><i>User ". $_SESSION['name'] ." has left the chat session.</i><br></div>");
fclose($fp);
session_destroy();
header("Location: index.php"); //Redirect the user
}
?>
</body>
</html>
Here's the code for login system which is login.php
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="en"> <!--<![endif]-->
<head>
<title>Login Form</title>
<style>
a:link {
color: black;
}
a:visited {
color: black;
}</style>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<?php
if (!isset($_POST['submit'])){
?>
<h1 class="register-title">Welcome</h1>
<form action="<?=$_SERVER['PHP_SELF']?>" method="post" class="register">
<div class="register-switch">
<input type="radio" name="type" value="L" id="login" class="register-switch-input" checked>
<label for="login" class="register-switch-label"><a href="login.php" style="text-decoration:none;" link="#000000" vlink="#000000" alink="#000000">Login</a></label>
<input type="radio" name="type" value="R" id="Register" class="register-switch-input">
<label for="Register" class="register-switch-label"><a href="register.php" style="text-decoration:none;">Register</a></label>
</div>
<input type="text" name="username" class="register-input" placeholder="User Name">
<input type="password" name="password"class="register-input" placeholder="Password">
<input type="submit" name="submit" value="Login" class="register-button">
</form>
<?php
} else {
require_once("db_const.php");
$mysqli = new mysqli(DB_HOST, DB_USER, DB_PASS, DB_NAME);
# check connection
if ($mysqli->connect_errno) {
echo "<p>MySQL error no {$mysqli->connect_errno} : {$mysqli->connect_error}</p>";
exit();
}
$username = $_POST['username'];
$password = $_POST['password'];
$sql = "SELECT * from users WHERE username LIKE '{$username}' AND password LIKE '{$password}' LIMIT 1";
$result = $mysqli->query($sql);
if (!$result->num_rows == 1) {
echo "<p>Incorrect Password</p>";
} else {
echo "<p>Logged in successfully</p>";
// do stuffs
header("Location: index.php");
}
}
?>
</body>
</html>
