0

hi

let me explain what i want
I have four pages.two html, one js and one php. First page is loginTab.html. There is a tab called "Tab One" when user clicks on it there is a script inside this html page which calls function and loads an external login.html form using ajax. in login.html there is a form and include external js code for ajax functions. what it does is when the user enters email and password and clicks submit then it triggers another ajax function which send a query to php file and compare those variables there with mysql db and returns the message to a div which is in login.html.

the problem here is when i enter email and password and clicks on submit button it does not display anything. How this problem can be solved.i am providing all of my code below

loginTab.html

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script>
window.onload = initAll;
var xhr = false;

function initAll() {
	if(window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	}
	else {
		if(window.ActiveXObject) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch(e) { }
		}
	}
}

function tabOne() {
	if(xhr) {
		xhr.onreadystatechange = showTabOne;
		xhr.open("GET","login.html", true);
		xhr.send(null);
	}
}

function showTabOne() {
	if(xhr.readyState == 4) {
		if(xhr.status == 200) {
			var outMsg = xhr.responseText;
		}
		else {
			var outMsg = "Sorry Error.";
		}
		document.getElementById("message").innerHTML = outMsg;
	}
}
</script>
<style>
.tabs {
	width: 100px;
	height: 25px;
	border: 1px solid black;
	cursor: pointer;
}
</style>
</head>

<body>
<div class="tabs" onclick="tabOne()">Tab One</div>
<div id="message"></div>
</body>
</html>

login.html

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="login.js" type="text/javascript"></script>
</head>

<body>
<div id="message"></div>
<form name="myForm">
<div>
	<label>Email:</label>
    <input type="text" name="email" id="email" />
</div>
<div>
	<label>password:</label>
    <input type="password" name="password" id="password" />
</div>
<div>
    <input type="button" name="submit" id="submit" value="Submit" onclick="ajaxFunction()" />
</div>
</form>
</body>
</html>

login.js

window.onload = initAll;
var xhr = false;
function initAll() {
	if(window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	}
	else {
		if(window.ActiveXObject) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch(e) { }
		}
	}
}
function ajaxFunction() {
	var email = document.getElementById('email').value;
	var password = document.getElementById('password').value;
	var queryString = "?email=" + email + "&password=" + password;

	if(xhr) {
		xhr.onreadystatechange = show;
		xhr.open("GET","login.php" + queryString,true);
		xhr.send(null);
	}
}

function show() {
	if(xhr.readyState == 4) {
		if(xhr.status == 200) {
			var outMsg = xhr.responseText;
		}
		else {
			var outMsg = "Sorry Problem";
		}
		document.getElementById("message").innerHTML = outMsg;
	}
}

login.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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<?php
$email = strip_tags($_GET['email']);
$password = strip_tags($_GET['password']);


if($email&&$password) {
	
	$connect = mysql_connect("localhost","root","123456");
	mysql_select_db("facebook");
	$query = mysql_query("SELECT email FROM users WHERE email='$email'");
	$count = mysql_num_rows($query);
	if($count == 0) {
		echo "You are registered thanks.";
	}
	else {
		die("That email address already exist.");
	}
}
else {
	die("please fill in both fields!");
}
?>
</body>
</html>

please help

1
Contributor
2
Replies
3
Views
7 Years
Discussion Span
Last Post by doforumda
0

when i check this code without loginTab.html then this works but with loginTab.html page it does not display any messages. please help me i am waiting

0

the main problem that i am facing is that the message from php script does not display on the screen what i want is to fix this problem. when i checked this code without loginTab.html and used on login.html and submit data it does display message but i want to use tabs so first the user will have to click that tab to get the form then fill that form and submit and compare that data in mysql db using php script. but the problem it it dos not display any message that generated my php.

I really need this please help
thanks in advance

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.