Ajax respondText isnt working - javascript

In my ajax i have a var named ajax for some reason when I run ajax.respondText.
In the php code I ask it to return the username of the one log in. Well it is echoing out the name of the user but is also echoing of the header of my website in the mix as you can see here - Andrew at the bottom of the first set of code. That is the only thing that should be echoed out not the html that is ahead it.
<DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Better Gamerz United</title>
<link rel="icon" href="http://www.bettergamerzunited.com/favicon.ico" type="image/x-icon"/>
<link rel="shortcut icon" href="http://www.bettergamerzunited.com/favicon.ico" type="image/x-icon"/>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a title="" class="navbar-brand " href="index.php">
<img src="img/BGU Logo.png" />
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active">Home</li>
<li>Recrutment</li>
<li>Servers</li>
<li>Forums</li>
<li>Contact Us</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a class="navbar-link" href="login.php">Login</a></li>
<li><a class="navbar-link" class="navbar-link"class="navbar-link" href="signup.php">Register</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-->
</nav>
</header>
Andrew
What could cause my header to be included in to my response so I did went alittle deeper and ran a console.log just the var ajax. which provided me this
XMLHttpRequest {statusText: "OK", status: 200, responseURL: "http://www.bettergamerzunited.com/login.php", response: "<DOCTYPE html>↵<html>↵<head>↵ <meta charset="UTF-8…iv><!-- /.container-->↵ </nav>↵</header>↵↵ Andrew", responseType: ""…}onabort: nullonerror: nullonload: nullonloadend: nullonloadstart: nullonprogress: nullonreadystatechange: function () {ontimeout: nullreadyState: 4response: "<DOCTYPE html>↵<html>↵<head>↵ <meta charset="UTF-8">↵ <title>Better Gamerz United</title>↵ <link rel="icon" href="http://www.bettergamerzunited.com/favicon.ico" type="image/x-icon"/>↵ <link rel="shortcut icon" href="http://www.bettergamerzunited.com/favicon.ico" type="image/x-icon"/>↵ <link rel="stylesheet" href="css/bootstrap.css">↵ <link rel="stylesheet" href="css/main.css">↵</head>↵<body>↵ <header>↵ <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">↵ <div class="container">↵ <!-- Brand and toggle get grouped for better mobile display -->↵ <div class="navbar-header">↵ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">↵ <span class="sr-only">Toggle navigation</span>↵ <span class="icon-bar"></span>↵ <span class="icon-bar"></span>↵ <span class="icon-bar"></span>↵ </button>↵ <a title="" class="navbar-brand " href="index.php">↵ <img src="img/BGU Logo.png" />↵ </a>↵ </div>↵↵ <!-- Collect the nav links, forms, and other content for toggling -->↵ <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">↵ <ul class="nav navbar-nav">↵ <li class="active">Home</li>↵ <li>Recrutment</li>↵ <li>Servers</li>↵ <li>Forums</li>↵ <li>Contact Us</li>↵ </ul>↵ <ul class="nav navbar-nav navbar-right">↵ <li><a class="navbar-link" href="login.php">Login</a></li>↵<li><a class="navbar-link" class="navbar-link"class="navbar-link" href="signup.php">Register</a></li>↵↵ </ul>↵ </div><!-- /.navbar-collapse -->↵ </div><!-- /.container-->↵ </nav>↵</header>↵↵ Andrew"responseText: "<DOCTYPE html>↵<html>↵<head>↵ <meta charset="UTF-8">↵ <title>Better Gamerz United</title>↵ <link rel="icon" href="http://www.bettergamerzunited.com/favicon.ico" type="image/x-icon"/>↵ <link rel="shortcut icon" href="http://www.bettergamerzunited.com/favicon.ico" type="image/x-icon"/>↵ <link rel="stylesheet" href="css/bootstrap.css">↵ <link rel="stylesheet" href="css/main.css">↵</head>↵<body>↵ <header>↵ <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">↵ <div class="container">↵ <!-- Brand and toggle get grouped for better mobile display -->↵ <div class="navbar-header">↵ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">↵ <span class="sr-only">Toggle navigation</span>↵ <span class="icon-bar"></span>↵ <span class="icon-bar"></span>↵ <span class="icon-bar"></span>↵ </button>↵ <a title="" class="navbar-brand " href="index.php">↵ <img src="img/BGU Logo.png" />↵ </a>↵ </div>↵↵ <!-- Collect the nav links, forms, and other content for toggling -->↵ <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">↵ <ul class="nav navbar-nav">↵ <li class="active">Home</li>↵ <li>Recrutment</li>↵ <li>Servers</li>↵ <li>Forums</li>↵ <li>Contact Us</li>↵ </ul>↵ <ul class="nav navbar-nav navbar-right">↵ <li><a class="navbar-link" href="login.php">Login</a></li>↵<li><a class="navbar-link" class="navbar-link"class="navbar-link" href="signup.php">Register</a></li>↵↵ </ul>↵ </div><!-- /.navbar-collapse -->↵ </div><!-- /.container-->↵ </nav>↵</header>↵↵ Andrew"responseType: ""responseURL: "http://www.bettergamerzunited.com/login.php"responseXML: nullstatus: 200statusText: "OK"timeout: 0upload: XMLHttpRequestUploadwithCredentials: false__proto__: XMLHttpRequest
Which the response is my header.
What I am asking is to please view my code below and trying to help me understand why this is happening. I'm confused and I have tried everything that I can to fix it.
File WIth Problem
<?php
include 'core/init.php';
include 'includes/overall/header.php';
// If user is already logged in, header that weenis away
if($user_ok == true){
header("location: user.php?u=".$_SESSION["username"]);
exit();
}
// AJAX CALLS THIS LOGIN CODE TO EXECUTE
if(isset($_POST["e"])){
// GATHER THE POSTED DATA INTO LOCAL VARIABLES AND SANITIZE
$e = mysqli_real_escape_string($mysqli, $_POST['e']);
$p = md5($_POST['p']);
// GET USER IP ADDRESS
$ip = preg_replace('#[^0-9.]#', '', getenv('REMOTE_ADDR'));
// FORM DATA ERROR HANDLING
if($e == "" || $p == ""){
echo "login_failed";
exit();
} else {
// END FORM DATA ERROR HANDLING
$sql = "SELECT id, username, password FROM users WHERE email='$e' AND activated='1' LIMIT 1";
$query = mysqli_query($mysqli, $sql);
$row = mysqli_fetch_row($query);
$db_id = $row[0];
$db_username = $row[1];
$db_pass_str = $row[2];
if($p != $db_pass_str){
echo "login_failed";
exit();
} else {
// CREATE THEIR SESSIONS AND COOKIES
$_SESSION['userid'] = $db_id;
$_SESSION['username'] = $db_username;
$_SESSION['password'] = $db_pass_str;
setcookie("id", $db_id, strtotime( '+30 days' ), "/", "", "", TRUE);
setcookie("user", $db_username, strtotime( '+30 days' ), "/", "", "", TRUE);
setcookie("pass", $db_pass_str, strtotime( '+30 days' ), "/", "", "", TRUE);
// UPDATE THEIR "IP" AND "LASTLOGIN" FIELDS
$sql = "UPDATE users SET ip='$ip', lastlogin=now() WHERE username='$db_username' LIMIT 1";
$query = mysqli_query($mysqli, $sql);
echo $db_username;
exit();
}
}
exit();
}
?>
<script>
function emptyElement(x){
_(x).innerHTML = "";
}
function login(){
var e = _("email").value;
var p = _("password").value;
var status = _("status");
if(e == "" || p == ""){
status.innerHTML = "Fill out all of the form data";
} else {
_("loginbtn").style.display = "none";
status.innerHTML = 'please wait ...';
var ajax = ajaxObj("POST", "login.php");
ajax.onreadystatechange = function() {
if(ajaxReturn(ajax) == true) {
if(ajax.responseText == "login_failed"){
status.innerHTML = "Login unsuccessful, please try again.";
_("loginbtn").style.display = "block";
} else {
console.log(ajax.responseText); //debugging use
window.location = "user.php?u="+ajax.responseText; // This is where the header is being added. I need the word anderw here with out my header being included.
}
}
}
ajax.send("e="+e+"&p="+p);
}
}
</script>
<html>
<div class="container background">
<p class="heading-title">Log In</p>
<form id="loginform" class="form-horizontal" onsubmit="return false">
<div class="form-group">
<label for="email" class="col-sm-2 control-label">Email Address</label>
<div class="col-sm-10">
<input type="test"10 name="email" onfocus="emptyElement('status')" maxlength="88" class="form-control" id="email" value="" autocomplete="off" placeholder="Please enter your email">
</div>
</div>
<div class="form-group">
<label for="password" class="col-sm-2 control-label">Password</label>
<div class="col-sm-10">
<input type="password" name="password" onfocus="emptyElement('status')" maxlength="16" class="form-control" id="password" value="" autocomplete="off" placeholder="Please enter your password">
<li class=""><a class="navbar-link" href="#">Forgot your password?</a></li>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 ">
<span class='pull-right text-danger' id="status"></span>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" id="loginbtn" onclick="login()" class="btn btn-primary pull-right">Log In</button><br><br>
</div>
</div>
</form>
</div>
</html>
<?php
include 'includes/overall/footer.php';
?>

This is coming from either of the following two includes at the top of your php script:
include 'core/init.php';
include 'includes/overall/header.php';
So restrict the unwanted output or file inclusion in time of an ajax call.

Related

How to display login error and "fill all the fields" messages on the same page using php?

I am building a php login page where the user is required to put in a username and password for logging in.
My question is
how can I display the 'invalid username or password' error message on the same page?
how can I display the "Fill up all the fields" message when users leave the fields empty?
In the code below when I leave the fields empty the "fill up all the fields" message disappears quickly. When I type a wrong password or username same thing happens. How can I get those messages to stay on shown on the page when an error occur?
Code:
<?php
session_start();
$json = isset($_POST["admin"]) ? $_POST["admin"] : "";
if (!($admin = checkJson($json))) {
print "Fill up all the fields";
exit();
}
mysqli_report(MYSQLI_REPORT_ALL ^ MYSQLI_REPORT_INDEX);
try {
$initials = parse_ini_file("../.ht.asetukset.ini");
$connection = mysqli_connect($initials["databaseserver"], $initials["username"], $initials["password"], $initials["database"]);
} catch (Exception $e) {
header("Location:../html/connectionError.html");
exit();
}
// Tehdään sql-lause, jossa kysymysmerkeillä osoitetaan paikat
// joihin laitetaan muuttujien arvoja
$sql = "select * from admin where uname=? and paswd=SHA2(?, 256)";
try {
$stmt = mysqli_prepare($connection, $sql);
mysqli_stmt_bind_param($stmt, 'ss', $admin->uname, $admin->paswd);
mysqli_stmt_execute($stmt);
$print = mysqli_stmt_get_result($stmt);
if ($row = mysqli_fetch_object($print)) {
$_SESSION["admin"] = "$row->uname";
print $_SESSION["returnSite"];
exit();
} else
print "Invalid username or password!";
mysqli_close($connection);
print "Login in...";
} catch (Exception $e) {
print "Error!";
}
?>
<?php
function checkJson($json)
{
if (empty($json)) {
return false;
}
$admin = json_decode($json, false);
if (empty($admin->uname) || empty($admin->paswd)
) {
return false;
}
return $admin;
}
?>
html code:
<!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.0">
<meta name="author" content="">
<meta name="description"
content="Team 14 project work. The website contains basic web development guides utilizing HTML5, CSS, JavaScript and Bootstrap">
<title>admin login</title>
<!--Link to bootstrap.-->
<link
href="https://cdn.jsdelivr.net/npm/bootstrap#5.1.3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
crossorigin="anonymous">
<!--Link to local css file.-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Dosis&display=swap"
rel="stylesheet">
</head>
<body>
<header>
<!--navigation bar starts here.-->
<nav class="navbar navbar-expand-lg navbar-light">
<div class="container-fluid">
<a class="navbar-brand" href="../html/index.html"
style="color: #0000ff; font-family: 'Dosis', sans-serif; font-size: 20px;"><b>CodeSchool</b></a>
<div id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link active"
aria-current="page" href="../html/html.html">HTML Basics</a></li>
<li class="nav-item"><a class="nav-link active"
href="../html/css.html">CSS Basics</a></li>
<li class="nav-item"><a class="nav-link active"
href="../html/js.html">JavaScript</a></li>
<li class="nav-item">
<!--anchor link added.--> <a class="nav-link active" href="#a">About
Us</a>
</li>
<li class="nav-item">
<!--anchor link added.--> <a class="nav-link active" href="#b">Contact
Us</a>
</li>
<li class="nav-item">
<!--anchor link added.--> <a class="nav-link active" href="../html/login.html">Log
In / Sign Up</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<!--navigation bar ends here.-->
<main>
<div class="box" style="background-color: #2f303a; color:white">
<h1 class="padding"><b>Admin login Page</b></h1><br>
<h1 class="padding"><b>Please provide your Administrator login credentials</b></h1><br>
</div>
<!--box with search bar ends here.-->
<!--other content.-->
<div class="sec1">
<h1 class="padding"><b>Administrators Login</b></h1><br>
<div class="sec">
<!--box with search bar starts here.-->
<form id='userForm'>
<h3>Username:</h3>
<input class='input' type='text' name='uname' value='' placeholder='Your username'><br>
<h3>Password:</h3>
<input class='input' type='password' name='paswd' value=''
placeholder='Enter your password' id="myInput"><br>
<p>
Show Password<input type="checkbox" onclick="myFunction()">
</p>
<br>
<div class='cnt'>
<input
style='font-size: 20px; background-color: #ff7a18; border-radius: 25px; width: 100px'
type='button' name='submit' value='Login'
onclick='sendInfo(this.form);'><br> <br></div>
</form>
<p id='result'></p>
<p style='font-size:20px'> <a class="nav-link active" href="./login.html">To go back to users login page click here!</a> </p>
<p style="font-size: 25px" id='result'></p>
</div>
</div>
</main>
<!--Footer starts here.-->
<footer>
<section class="mb-4" id="b">
<!--Section heading-->
<h2 class="h1-responsive font-weight-bold text-center my-4">Contact
Us</h2>
<!--Section description-->
<p class="text-center w-responsive mx-auto mb-5">Do you have any
questions? Please do not hesitate to contact us directly. Our team
will come back to you within a matter of hours to help you.</p>
<div class="row">
<div class="col-md-9 mb-md-0 mb-5">
<form id="contact-form" name="contact-form" action="mail.php"
method="POST">
<div class="row">
<div class="col-md-6">
<div class="md-form mb-0">
<input type="text" id="name" name="name" class="form-control">
<label for="name" class="">Your name</label>
</div>
</div>
<div class="col-md-6">
<div class="md-form mb-0">
<input type="text" id="email" name="email" class="form-control">
<label for="email" class="">Your email</label>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="md-form mb-0">
<input type="text" id="subject" name="subject"
class="form-control"> <label for="subject" class="">Subject</label>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="md-form">
<textarea id="message" name="message" rows="2"
class="form-control md-textarea"></textarea>
<label for="message">Your message</label>
</div>
</div>
</div>
</form>
<div class="text-center text-md-left">
<a class="btn btn-primary"
onclick="document.getElementById('contact-form').submit();">Send</a>
</div>
<div class="status"></div>
</div>
<div class="col-md-3 text-center">
<ul class="list-unstyled mb-0">
<li><i class="fas fa-map-marker-alt fa-2x"></i>
<p>Visamäentie 35 A, 13100 Hämeenlinna</p></li>
<li><i class="fas fa-phone mt-4 fa-2x"></i>
<p>(+358) 23456 789</p></li>
<li><i class="fas fa-envelope mt-4 fa-2x"></i>
<p>email#email.com</p></li>
</ul>
</div>
</div>
</section>
<div class="container">
<div class="py-3 my-4">
<ul class="nav justify-content-center border-bottom pb-3 mb-3">
<li class="nav-item"><a class="nav-link px-2 text-muted">Facebook</a></li>
<li class="nav-item"><a class="nav-link px-2 text-muted">Instagram</a></li>
<li class="nav-item"><a class="nav-link px-2 text-muted">LinkedIn</a></li>
<li class="nav-item"><a class="nav-link px-2 text-muted">Discord</a></li>
</ul>
<p class="text-center text-muted">© 2022 HAMK, Team 14</p>
</div>
</div>
</footer>
<!--Footer ends here.-->
<script>
function sendInfo(form){
var admin=new Object();
admin.uname=form.uname.value;
admin.paswd=form.paswd.value;
var jsonAdmin=JSON.stringify(admin);
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("result").innerHTML =
this.responseText;
if (this.responseText=="Error"){
document.getElementById("result").innerHTML =
"Username or/and password are wrong";
}
else{
window.location.assign("../php/admin.php");
}
}
};
xmlhttp.open("POST", "../php/admin_login.php", true);
xmlhttp.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xmlhttp.send("admin=" + jsonAdmin);
}
</script>
<script>
function myFunction() {
var x = document.getElementById("myInput");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}
</script>
</body>
</html>
use the session for displaying the message and unset it after display that variable so that, it is not come again
$_SESSION['message'] = "Invalid username or password!";
if($_SESSION['message']!=''){
echo $_SESSION['message'];// display the message
unset($_SESSION['message']);// unset the message, so it is not come again in same page
}

Bootstrap Modal Not Woking

I Have a code that will get the data from database to a modal pop up via ajax/json i successfully get the data. but im not able to show my modal. heres my code.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<link rel="stylesheet" href="css/w3.css">
<!-- Scripts -->
<script src="js/jquery-3.2.1.slim.min.js" crossorigin="anonymous"></script>
<script src="js/jquery-3.2.1.js" crossorigin="anonymous"></script>
<script src="js/popper.min.js" crossorigin="anonymous"></script>
<script src="js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
<!-- Scripts -->
<script type="text/javascript">
//Start Update Function
function GetUserDetails(EmployeesID) {
// Add User ID to the hidden field for furture usage
$("#hidden_user_id").val(EmployeesID);
$.post("ajax/readUserDetails.php", {
EmployeesID: EmployeesID
},
function (data, status) {
// PARSE json data
var tblinfo = JSON.parse(data);
// Assing existing values to the modal popup fields
$("#update_first_name").val(tblinfo.firstname);
$("#update_last_name").val(tblinfo.lastname);
$("#update_basic_salary").val(tblinfo.basicsalary);
}
);
// Show Modal
$("#update_user_modal").modal("show");
}
//End Update Function
body{
background-color:#e9ecef;
}
</style>
</head>
<body>
<div class="topd">
<h1>Welcome to HopesV2.0</h1>
</div>
<nav class="navbar navbar-expand-lg navbar-light w3-teal" data-spy="affix" data-offset-top="197">
<a class="navbar-brand" href="#"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="http://example.com" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
HR
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
<a class="nav-item nav-link" href="#">Features</a>
<a class="nav-item nav-link" href="#">Pricing</a>
<a class="nav-item nav-link" href="first.php" onclick="return confirm('Are you want to exit?')">Logout</a>
</div>
</div>
</nav>
<BR>
<!-- Start Body -->
<div class="jumbotron zbody">
<h1>Basic Information</h1>
<hr class="my-4">
<p class="lead">
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
<!-- Modal - Update User details -->
<div class="modal fade" id="updateusermodal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Update</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label for="update_first_name">First Name</label>
<input type="text" id="update_first_name" placeholder="First Name" class="form-control"/>
</div>
<div class="form-group">
<label for="update_last_name">Last Name</label>
<input type="text" id="update_last_name" placeholder="Last Name" class="form-control"/>
</div>
<div class="form-group">
<label for="update_basic_salary">Basic Salary</label>
<input type="text" id="update_basic_salary" placeholder="Basic Salary" class="form-control"/>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" onclick="UpdateUserDetails()" >Save Changes</button>
<input type="hidden" id="hidden_user_id">
</div>
</div>
</div>
</div>
<!-- // Modal -->
<div class="row">
<div class="col-md-12">
<h4>Records:</h4>
<div class="records_content"></div>
</div>
</form>
</p>
</div>
<!-- End Body -->
</body>
</html>
heres my readuserdetails.php
<?php
// include Database connection file
include("myconnection.php");
// check request
if(isset($_POST['EmployeesID']) && isset($_POST['EmployeesID']) != "")
{
// get User ID
$EmployeesID = $_POST['EmployeesID'];
// Get User Details
$query = "SELECT * FROM tblinfo WHERE EmployeesID = '$EmployeesID'";
if (!$result = mysqli_query($con, $query)) {
exit(mysqli_error($con));
}
$response = array();
if(mysqli_num_rows($result) > 0) {
while ($row = mysqli_fetch_assoc($result)) {
$response = $row;
}
}
else
{
$response['status'] = 200;
$response['message'] = "Data not found!";
}
// display JSON data
echo json_encode($response);
}
else
{
$response['status'] = 200;
$response['message'] = "Invalid Request!";
}
and my code for populating the data into tables:
<?php
// include Database connection file
include("myconnection.php");
// Design initial table header
$data = '<table class="table table-bordered table-striped">
<tr>
<th>No.</th>
<th>First Name</th>
<th>Last Name</th>
<th>Basic Salary</th>
<th>Update</th>
<th>Delete</th>
</tr>';
$query = "SELECT * FROM tblinfo";
if (!$result = mysqli_query($con, $query)) {
exit(mysqli_error($con));
}
// if query results contains rows then featch those rows
if(mysqli_num_rows($result) > 0)
{
$number = 1;
while($row = mysqli_fetch_assoc($result))
{
$data .= '<tr>
<td>'.$number.'</td>
<td>'.$row['firstname'].'</td>
<td>'.$row['lastname'].'</td>
<td>'.$row['basicsalary'].'</td>
<td>
<button onclick="GetUserDetails('.$row['EmployeesID'].')" class="btn btn-warning">Update</button>
</td>
<td>
<button onclick="DeleteUser('.$row['EmployeesID'].')" class="btn btn-danger">Delete</button>
</td>
</tr>';
$number++;
}
}
else
{
// records now found
$data .= '<tr><td colspan="6">Records not found!</td></tr>';
}
$data .= '</table>';
echo $data;
?>
i try to show the data i fetch via alert(data) and its shows that i already fetch data from my database. i just dont get why the bootstrap modal is not showing. its like reloading the page only.
Open your modal after the AJAX is completed and the content is appended in the modal, your id is incorrect, it should be updateusermodal
function (data, status) {
// PARSE json data
var tblinfo = JSON.parse(data);
// Assing existing values to the modal popup fields
$("#update_first_name").val(tblinfo.firstname);
$("#update_last_name").val(tblinfo.lastname);
$("#update_basic_salary").val(tblinfo.basicsalary);
$("#updateusermodal").modal("show");
}
change your onclick event to onclick="GetUserDetails(EmployeesID,event)"
prevent the default click intro your function:
function GetUserDetails(EmployeesID,event) {
event.preventDefault()

how to hide some content after user logged in header

I want to hide login and sign up box and button after user login. I have tried but it won't work. Here are my codes
header.php
<!DOCTYPE HTML>
<html>
<head>
<title>My Play a Entertainment Category Flat Bootstrap Responsive Website Template | Home :: w3layouts</title>
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- bootstrap -->
<link href="css/bootstrap.min.css" rel='stylesheet' type='text/css' media="all" />
<!-- //bootstrap -->
<link href="css/dashboard.css" rel="stylesheet">
<!-- Custom Theme files -->
<link href="css/style.css" rel='stylesheet' type='text/css' media="all" />
<script src="js/jquery-1.11.1.min.js"></script>
<!--start-smoth-scrolling-->
</head>
<body>
<?php
session_start();
if(!isset($_SESSION["sess_email"])){
?>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><h1><img src="images/logo.png" alt="" /></h1></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<div class="top-search">
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
<input type="submit" value=" ">
</form>
</div>
<div class="header-top-right">
<div class="file">
Upload
</div>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><h1><img src="images/logo.png" alt="" /></h1></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<div class="top-search">
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
<input type="submit" value=" ">
</form>
</div>
<div class="header-top-right">
<div class="file">
Upload
</div>
<div class="signin">
Sign Up
<!-- pop-up-box -->
<script type="text/javascript" src="js/modernizr.custom.min.js"></script>
<link href="css/popuo-box.css" rel="stylesheet" type="text/css" media="all" />
<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
<!--//pop-up-box -->
<div id="small-dialog2" class="mfp-hide">
<h3>Create Account</h3>
<div class="social-sits">
<div class="facebook-button">
Connect with Facebook
</div>
<div class="chrome-button">
Connect with Google
</div>
<div class="button-bottom">
<p>Already have an account? Login</p>
</div>
</div>
<div class="signup">
<form action="addnewuser.php" " method="post">
<input type="text" name="username" class="email" placeholder="username" autocomplete="off"/>
<input type="text" name="email" class="email" placeholder="Email" required="required" pattern="([\w-\.]+#([\w-]+\.)+[\w-]{2,4})?" title="Enter a valid email"/>
<input type="password" name="password" required="required" pattern=".{6,}" title="Minimum 6 characters required" autocomplete="off"/>
<input type="text" name="mnumber" class="email" placeholder="Mobile Number" maxlength="10" pattern="[1-9]{1}\d{9}" title="Enter a valid mobile number" />
<br><input type="radio" name="gender" value="male" checked> Male<br>
<input type="radio" name="gender" value="female"> Female<br>
<input type="radio" name="gender" value="other"> Other
<br>
<input type="submit" value="Signup" name="submit" />
</form>
</div>
<div class="clearfix"> </div>
</div>
<script>
$(document).ready(function() {
$('.popup-with-zoom-anim').magnificPopup({
type: 'inline',
fixedContentPos: false,
fixedBgPos: true,
overflowY: 'auto',
closeBtnInside: true,
preloader: false,
midClick: true,
removalDelay: 300,
mainClass: 'my-mfp-zoom-in'
});
});
</script>
</div>
<div class="signin">
Sign In
<div id="small-dialog" class="mfp-hide">
<h3>Login</h3>
<div class="social-sits">
<div class="facebook-button">
Connect with Facebook
</div>
<div class="chrome-button">
Connect with Google
</div>
<div class="button-bottom">
<p>New account? Signup</p>
</div>
</div>
<div class="signup">
<form action="login1.php" method="post">
<input type="text" name="email" class="email" placeholder="Email" required="required" pattern="([\w-\.]+#([\w-]+\.)+[\w-]{2,4})?" title="Enter a valid email"/>
<input type="password" name="password" required="required" pattern=".{6,}" title="Minimum 6 characters required" autocomplete="off"/>
<input type="submit" value="Login" name="submit" />
</form>
<div class="forgot">
Forgot password ?
</div>
</div>
<div class="clearfix"> </div>
</div>
</div>
<div class="clearfix"> </div>
</div>
</div>
<div class="clearfix"> </div>
</div>
</nav>
<?php } else { ?>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><h1><img src="images/logo.png" alt="" /></h1></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<div class="top-search">
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
<input type="submit" value=" ">
</form>
</div>
<div class="header-top-right">
<div class="file">
Upload
</div>
<?=$_SESSION['sess_email'];?>Logout
<?php
}
?>
index.php
<?php include 'includes/header.php';?>
<!-- /header -->
<div class="col-sm-3 col-md-2 sidebar">
<div class="top-navigation">
<div class="t-menu">MENU</div>
<div class="t-img">
<img src="images/lines.png" alt="" />
</div>
<div class="clearfix"> </div>
</div>
<div class="drop-navigation drop-navigation">
<ul class="nav nav-sidebar">
<li class="active"><span class="glyphicon glyphicon-home" aria-hidden="true"></span>Home</li>
<li><span class="glyphicon glyphicon-home glyphicon-blackboard" aria-hidden="true"></span>TV Shows</li>
<li><span class="glyphicon glyphicon-home glyphicon-hourglass" aria-hidden="true"></span>History</li>
<li><span class="glyphicon glyphicon-film" aria-hidden="true"></span>Movies<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span></li>
<ul class="cl-effect-2">
<li>English</li>
<li>Chinese</li>
<li>Hindi</li>
</ul>
<!-- script-for-menu -->
<script>
$( "li a.menu1" ).click(function() {
$( "ul.cl-effect-2" ).slideToggle( 300, function() {
// Animation complete.
});
});
</script>
<li><span class="glyphicon glyphicon-film glyphicon-king" aria-hidden="true"></span>Sports<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span></li>
<ul class="cl-effect-1">
<li>Football</li>
<li>Cricket</li>
<li>Tennis</li>
<li>Shattil</li>
</ul>
<!-- script-for-menu -->
<script>
$( "li a.menu" ).click(function() {
$( "ul.cl-effect-1" ).slideToggle( 300, function() {
// Animation complete.
});
});
</script>
<li><span class="glyphicon glyphicon-music" aria-hidden="true"></span>Songs</li>
<li><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>News</li>
</ul>
<!-- script-for-menu -->
<script>
$( ".top-navigation" ).click(function() {
$( ".drop-navigation" ).slideToggle( 300, function() {
// Animation complete.
});
});
</script>
<div class="side-bottom">
<div class="side-bottom-icons">
<ul class="nav2">
<li> </li>
<li> </li>
<li> </li>
<li> </li>
</ul>
</div>
</div>
</div>
</div>
</div>
<?php include 'includes/footer.php';?>
login.php
<?php
if(isset($_POST["submit"])){
if(!empty($_POST['email']) && !empty($_POST['password'])) {
$email=$_POST['email'];
$password=$_POST['password'];
$con=mysql_connect('localhost','root','') or die(mysql_error());
mysql_select_db('site1') or die("cannot select DB");
$query=mysql_query("SELECT * FROM user WHERE email='".$email."' AND password='".$password."'");
$numrows=mysql_num_rows($query);
if($numrows!=0)
{
while($row=mysql_fetch_assoc($query))
{
$dbemail=$row['email'];
$dbpassword=$row['password'];
}
if($email == $dbemail && $password == $dbpassword)
{
session_start();
$_SESSION['sess_email']=$email;
/* Redirect browser */
header("Location: index.php");
}
} else {
echo "Invalid email or password!";
}
} else {
echo "All fields are required!";
}
}
?>
There is something with your session_start(). These need to be on top of each file you are using the session handler. If you don't put session_start() on top, the headers won't be sent to the browser.
So your files would look like:
Header.php
<?php
session_start(); # This need to be on top, when using sessions!
?>
<!DOCTYPE HTML>
<html>
<head>
Login.php
<?php
session_start(); # This need to be on top, when using sessions!
if(isset($_POST["submit"])){
In headers.php check if $_SESSION['sess_email'] variable is not empty. If empty then display the login button.
start at the top of your page with
<?php
session_start();
//after you started the session create the rest of your page
?>
<!DOCTYPE HTML>
<html>
<head>
then at login.php you , again, start with
<?php
session_start();
at the top of your page
then create a if statement:
if(isset($_POST["submit"])){
//disable the login / signup button(s) here
//for example:
$logged_in = true;
} else $logged_in = false;
then create a jQuery function like this:
<script>
var logged_in = '<?php echo $logged_in ; ?>';
if(logged_in === "true") {
$(".signin").hide();
} else {
$(".signin").show();
}
</script>
or in javascript
<script>
var logged_in = '<?php echo $logged_in ; ?>';
if(logged_in === "true") {
document.getElementsByClassName("signin").style.visibility = "hidden";
} else {
document.getElementsByClassName("signin").style.visibility = "visible";
}
</script>

Get value in looping, send to another page and call catch data using that value

I use session to send that value to other page, but mysql syntax does not display the data using that value. It doesnt show the error on MySQL syntax. Can someone help me? and Explain why mysql syntax cannot read the session? or I need to assign new variable for session on the pakejlist.php page?
the value already call from DB and display on A HREF link on food.php , i want to get that value on pakejlist.php mysql syntax.
and what I achieve is nothing.. the syntax just fine but the data doesnt came out.
//food.php
<?php include("../kahwin/Connections/conn.php"); ?>
<!DOCTYPE html>
<html>
<head>
<title>Kahwin Ringkas</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/kahwin/index.php">Walimatul Urus</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><span class="glyphicon glyphicon-log-in"></span> Login</li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="page-header">
<h1>Carian Katering</h1>
</div>
<?php
session_start();
$_SESSION['id'] = $row['v_id'];
mysql_select_db($database_conn, $conn);
$sql = mysql_query("SELECT * FROM vendor WHERE type = 'Katering'") or die (mysql_error());
while ($row = mysql_fetch_array($sql)) {
?>
<div class="col-md-4">
<?php echo '<img src="data:image;base64, '.$row['img'].'" class="img-thumbnail">' ?>
<h4><?php echo $row['companyName']?></h4>
<p><?php echo $row['address']?>, <?php echo $row['code']?> <?php echo $row['city']?>, <?php echo $row['state']?><br><?php echo $row['contact']?><br><?php echo $row['email']?><br></p>
View Package<br>
</div>
<?php }
?>
</div>
</body>
</html>
//pakejlist.php
<?php include("../kahwin/Connections/conn.php"); ?>
<!DOCTYPE html>
<html>
<head>
<title>Kahwin Ringkas</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/kahwin/index.php">Walimatul Urus</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><span class="glyphicon glyphicon-log-in"></span> Login</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading -->
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Senarai Pakej</h1>
</div>
</div>
<!-- /.row -->
<!-- Project One -->
<?php
//$vid = $_REQUEST['id'];
session_start();
mysql_select_db($database_conn, $conn);
$sql = mysql_query("SELECT * FROM pakej WHERE v_id = '" .$_SESSION['id']. "' ") or die (mysql_error());
while ($result = mysql_fetch_array($sql)) {
?>
<div class="row">
<div class="col-md-6">
<h3><?php echo $result['name_p']?></h3>
<h4>$ <?php echo $result['harga']?></h4>
<p><?php echo $result['descr']?></p>
<a class="btn btn-primary" href="#">Add to cart <span class="glyphicon glyphicon-chevron-right"></span></a>
</div>
<div class="col-md-5"></div>
</div>
<?php }
?>
<!-- /.row -->
<hr>
</body>
</html>
In food.php, you are initialising session variable $_SESSION['id'] = $row['v_id'] , outside mysql_fetch_array loop. So $row['v_id'] is empty. Also if you initialize that from within the loop, it will be overwritten and will have the value from the last row.
In the loop,
View Package<br>
The value in anchor tag does not mean anything. It is not valid. So you can try this instead..
View Package<br>
And in the pakejlist.php you will have change to
$sql = mysql_query("SELECT * FROM pakej WHERE v_id = '" .$_GET['v_id']. "' ") or die (mysql_error());
Hope this helps...

after navigate to another page, bootstrap dropdown become unusable

I had 3 .php files, they are index.php, load_file.php,and register.php
In index.php, contain navigation, and each navigation has dropdown list, i call this navigation and the dropdown from database. and also index.php has link to register.php, note : load_file.php included in this file
In load_file.php, contain code to check value of page, by using if($_GET['page']),and trigger every value with switch-case
register.php, just a normal form
My problem is, after I navigate to register.php by typing ?page=register in browser, my dropdown in index.php file become unusable
::UPDATE::
this is my index.php file
<?php
session_start();
require_once './model/functions.php';
if(isset($_GET["category"])){
$index_page= $_GET["category"];
$index_sub_page= null;
}elseif (isset ($_GET["sub_category"])) {
$index_sub_page = $_GET["sub_category"];
$index_page= null;
}else{
$index_sub_page= null;
$index_page= null;
}
if($_POST){
$username = $_POST["username"];
$password = $_POST["password"];
if(check_username_and_password_from_users($username, $password)){
$_SESSION["username"] = $username;
}
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Learn Bootstrap</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
</head>
<body>
<div id="TopContainer" class="container">
<div class="pull-right navbar-default">
<ul class="nav navbar-nav">
<?php if(isset($_SESSION["username"])){ ?>
<li class="dropdown">
<a class="dropdown-toggle" href="#" data-toggle="dropdown"><?php echo $_SESSION["username"]; ?></a>
<div class="dropdown-menu" style="padding: 17px;">
Logout
</div>
</li>
<?php }else{ ?>
<!--dropdown here -->
<li class="dropdown">
<a class="dropdown-toggle" href="#" data-toggle="dropdown" id="login">Dropdown</a>
<div class="dropdown-menu" style="padding:17px;">
<form id="loginform" method="post" action="index.php" class="form">
<div class="form-group">
<input class="form-control" type="text" name="username" id="username" placeholder="username">
</div>
<div class="form-group">
<input class="form-control" type="password" name="password" id="password" placeholder="password">
</div>
<input type="submit" value="Submit">
</form>
</div>
</li>
<li>Register</li>
<?php } ?>
<li>FAQs</li>
<li>Twitter</li>
<li>Facebook</li>
</ul>
</div>
</div>
<div id="logo" class="container">
<div class="col-md-6">
<a class="navbar no-margin" href="#"><img src="picture/LogoSaya.png"></a>
</div>
<div class="col-md-6">
<div class="col-md-6 pull-right">
<div class="input-group input-group-sm">
<span class="input-group-btn">
<button class="btn btn-default" type="button">Go!</button>
</span>
<input type="text" class="form-control" placeholder="Search for...">
</div>
</div>
</div>
</div>
<nav class="container">
<div class="navbar navbar-default">
<ul class="nav navbar-nav">
<?php
$subject_set = find_all_subjects();
while($subject = mysqli_fetch_assoc($subject_set)){
?>
<li>
<a id="dLabel" data-target="#" href="?subject=<?php echo urlencode($subject["id"]);?>" data-toggle="dropdown" aria-haspopup="true" role="button">
<?php echo $subject["name"];?>
<span class="caret"></span>
</a>
<!--dropdown here -->
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<?php
$page_set = find_pages_from_subjects($subject["id"]);
while($page = mysqli_fetch_assoc($page_set)){
?>
<li>
<?php echo $page["name"];?>
<ul>
<?php
$sub_page_set = find_sub_pages_from_pages($page["id"]);
while($sub_page = mysqli_fetch_assoc($sub_page_set)){
?>
<li>
<?php echo $sub_page["name"];?>
</li>
<?php
}
clear_result($sub_page_set);
?>
</ul>
</li>
<?php
}
clear_result($page_set);
?>
</ul>
</li>
<?php
}
clear_result($subject_set);
?>
</ul>
</div>
</nav>
<div class="container">
<?php
include "load_files.php"; //this is to load the files
?>
</div>
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
</body>
</html>
to navigate register.html, i use this code
<li>Register</li>
as you can see, i put code on below in index.php
<?php
include "load_files.php"; //this is to load file
?>
and this is my load_files.php
<?php
if($_GET){
switch ($_GET['page']) {
case 'register':
if(!file_exists("register.html")){
die("Sorry Empty Page");
}
include 'register.html';
break;
default:
break;
}
}
?>
Seems like an event handler issue. I'd look at how you are adding event handlers and see if the handler is getting wiped out somehow.
::SOLVED::
My problem is, after I navigate to register.php by typing ?page=register in browser, my dropdown in index.php file become unusable
this problem happen because, i had 2
<script src="jquery.js"></script>
, inside index.php and register.html .by remove the one inside register.html will solve the problem

Categories

Resources