Fade Contact Form "Thank You" Div - javascript

I have an email submit form using a javascript and contact.php code
Here is the javascript
function createRequestObject() {
var ro;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
ro = new ActiveXObject("Microsoft.XMLHTTP");
}else{
ro = new XMLHttpRequest();
}
return ro;
}
var http = createRequestObject();
function sendemail() {
var email = document.contactform.email.value;
document.contactform.send.disabled=true;
http.open('get', '/contact.php?email='+email+'&action=send');
http.onreadystatechange = handleResponse;
http.send(null);
}
function handleResponse() {
if(http.readyState == 4){
var response = http.responseText;
var update = new Array();
if(response.indexOf('|' != -1)) {
update = response.split('|');
document.getElementById(update[0]).innerHTML = update[1];
}
}
}
and here is a section of the contact.php
<?php
$to = ""; //This is the email address you want to send the email to
$subject_prefix = ""; //Use this if you want to have a prefix before the subject
if(!isset($_GET['action']))
{
die("You must not access this page directly!"); //Just to stop people from visiting contact.php normally
}
$subject = "Newsletter Sign Up"; //The senders subject
$message = trim($_GET['email']); //The senders subject
$email = ""; //The senders email address
mail($to,$subject,$message,"From: ".$email.""); //a very simple send
echo 'contactarea|<div id="thanks">thank you</div>'; //now lets update the "contactarea" div on the contact.html page. The contactarea| tell's the javascript which div to update.
?>
and the HTML
<div id="contactarea">
<form name="contactform" id="contactform">
<input class ="email" type="text" name="email" id="inputbox" value="e-mail"
onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/>
<input type="submit" value="sign up" name="send" onclick="sendemail(); return false; " class="signup" >
</form>
</div>
I am trying to fade the "Thank You" after 5 seconds but I am having some trouble.
If I set it to fade on the click of the submit button it doesn't seem to work because it it is not there until the button is clicked.
If I set it to fade on load, it only works if the button is clicked before the fade time
IS there a way to fade out not on the load of the page, but on the load of the div itself?

Try
echo 'contactarea|<div id="thanks">thank you</div>';
to
echo '
contactarea|<div id="thanks">thank you</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
setTimeout(function(){
$("#thanks").fadeOut();
},5000);
});
</script>
';

How about:
function sendemail() {
var email = document.contactform.email.value;
document.contactform.send.disabled=true;
http.open('get', '/contact.php?email='+email+'&action=send');
http.onreadystatechange = handleResponse;
http.send(null);
}
to:
function sendemail() {
var email = document.contactform.email.value;
document.contactform.send.disabled=true;
http.open('get', '/contact.php?email='+email+'&action=send');
http.onreadystatechange = handleResponse;
http.send(null);
setTimeout(function(){
$(document).find("#thanks").fadeOut();
},5000);
}

Related

Calling Javascript function defined in external file through PHP

I have a web page on which i have a simple login form consisting of username and password text fields.
I validate the login form using javascript external file and if javascript code returns true, login form is submitted otherwise an error message is displayed via javascript function named displayErrorBlock() that i wrote.
If the form is submitted then using PHP, i verify username and password. If username/password combination is incorrect or doesn't exists in database, i want to call the same javascript function (displayErrorBLock) from PHP code.
To do this, i echo this
else { // if username/password combination is incorrect
echo '<script>displayErrorBlock("Incorrect Username/Password")</script>';
}
but this gives me displayErrorBLock undefined error because javascript is loaded at the end of the body tag of my web page.
Question
How can i call javascript function (displayErrorBlock) that is defined in an external file ?
This is the displayErrorBlock function defined in an external js file
function displayErrorBlock(errorMsg) {
'use strict';
let errorBlock = document.querySelector('.error-msg-block');
errorBlock.style.display = 'block';
errorBlock.firstElementChild.textContent = errorMsg;
setTimeout(function () {
errorBlock.style.height = '48px';
}, 10);
}
Edit
Here my entire web page
<?php
require 'DbConnection.php';
// if login button is clicked
if(isset($_POST['login-btn'])) {
$username = $_POST['username-field'];
$password = $_POST['password-field'];
verifyLoginCredentials($username, $password);
}
// verify admin login credentials
function verifyLoginCredentials($username, $password) {
global $dbConnect;
$query = 'SELECT full_name, username, password FROM admins WHERE username = ?';
$statement = $dbConnect->prepare($query);
if($statement) {
$statement->bind_param('s', $username);
$statement->execute();
$resultSet = $statement->get_result();
// since there will be only one row returned at max, no need of a loop
$row = $resultSet->fetch_assoc();
if($row != null) {
$adminFullName = $row['full_name'];
$adminUsername = $row['username'];
$adminPassword = $row['password'];
// if username/password is correct start session and store
// username, password, full name in the session and login
// admin to his account
if($username === $adminUsername && password_verify($password, $adminPassword)) {
session_start();
$_SESSION['current_admin_fullname'] = $adminFullName;
$_SESSION['current_admin_username'] = $adminUsername;
$_SESSION['current_admin_password'] = $adminPassword;
//take current admin to admin dashboard
header('Location:admin dashboard.php');
}
else { // if username/password combination is incorrect
echo '<script>displayErrorBlock("Incorrect Username/Password")</script>';
}
} else { // if username doesn't exists in the database
echo '<script>displayErrorBlock("Entered Username isn\'t registered")</script>';
}
}
}
?>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="../Resources/Bootstrap v4.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="../CSS/admin login.css"/>
<link rel="stylesheet" href="../CSS/common.css"/>
<title>Admin Login</title>
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 navbar-container">
<nav class="top-navbar">
<img src="../Resources/images/logo.png" alt="logo"/>
<p>Admin Panel</p>
</nav><!--end of navbar-->
</div><!--end of first column-->
</div><!--end of first row-->
<div class="row">
<div class="col-sm-4 login-form-container">
<p class="error-msg-block">
<span></span>
</p>
<form class="login-form" method="post" action="admin login.php" onsubmit="return validateForm()">
<p>Welcome Back!</p>
<div class="form-group username-group">
<label for="username-field">Username</label>
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">
<img src="../Resources/images/envelope.png" alt="envelope image"/>
</div>
</div>
<input class="form-control" id="username-field" type="text" name="username-field" id="username-field" placeholder="Username"/>
</div>
</div><!--end of first form group-->
<div class="form-group password-group">
<label for="password-field">Password</label>
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">
<img src="../Resources/images/lock.png" alt="lock image"/>
</div>
</div>
<input class="form-control" id="password-field" type="password" name="password-field" id="password-field" placeholder="Password"/>
</div>
</div><!--end of second form-group-->
<input type="submit" class="btn" id="login-btn" name="login-btn" value="Login"/>
</form><!--end of login form-->
</div><!--end of first column-->
</div><!--end of second row-->
</div><!--end of container-->
<!--CDN versions of JQuery and Popper.js-->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script>
<script src="../Resources/Bootstrap v4.1/js/bootstrap.min.js"></script>
<script src="../Javascript/admin login form validation.js"></script>
</body>
</html>
Updated Question
I am facing a couple of problems.
I am getting whole web page as a response when i try to log to log .responseText to console inside .onLoad method.
When form is submitted via ajax, main if statement in php file
if(isset($_POST['login-btn'])) {....}
never evaluates to true, hence php code isn't executing.
What am i doing wrong here?
Here's my php code
<?php
require 'DbConnection.php';
// if login button is clicked
if(isset($_POST['login-btn'])) {
$username = $_POST['username-field'];
$password = $_POST['password-field'];
echo '<script>alert(\'form submitted\')</script>'; <---- this alert is never invoked
verifyLoginCredentials($username, $password);
}
// verify admin login credentials
function verifyLoginCredentials($username, $password) {
global $dbConnect;
$query = 'SELECT full_name, username, password FROM admins WHERE username = ?';
$statement = $dbConnect->prepare($query);
if($statement) {
$statement->bind_param('s', $username);
$statement->execute();
$resultSet = $statement->get_result();
// since there will be only one row returned at max, no need of a loop
$row = $resultSet->fetch_assoc();
if($row != null) {
$adminFullName = $row['full_name'];
$adminUsername = $row['username'];
$adminPassword = $row['password'];
// if username/password is correct start session and store
// username, password, full name in the session
if($username === $adminUsername && password_verify($password, $adminPassword)) {
session_start();
$_SESSION['current_admin_fullname'] = $adminFullName;
$_SESSION['current_admin_username'] = $adminUsername;
$_SESSION['current_admin_password'] = $adminPassword;
}
else { // if username/password combination is incorrect
echo 'Incorrect Username/Password Combination';
}
} else { // if username doesn't exists in the database
echo 'Entered username isn\'t registered';
}
} else {
echo 'Error while preparing sql query';
}
}
?>
Here's my relevant javascript code
let loginForm = document.querySelector('.login-form');
let usernameField = document.getElementById('username-field');
let passwordField = document.getElementById('password-field');
// submit login form to server using ajax
function ajaxFormSubmit() {
'use strict';
let ajaxRequest = new XMLHttpRequest();
let url = 'admin login.php';
// login form submitted on server successfully
ajaxRequest.onload = function () {
if (ajaxRequest.readyState === 4 && ajaxRequest.status === 200) {
console.log(ajaxRequest.responseText);
displayInfoMessage(ajaxRequest.responseText, 'success');
}
};
// error while login form submission on server
ajaxRequest.onerror = function () {
if (ajaxRequest.status !== 200) {
console.log(ajaxRequest.responseText);
displayInfoMessage(ajaxRequest.responseText, 'error');
}
};
ajaxRequest.open('POST', url, true);
ajaxRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
ajaxRequest.send(new FormData(loginForm));
}
function validateForm(e) {
'use strict';
// prevent form submission
e.preventDefault();
if (anyEmptyField()) {
displayInfoMessage('Please fill all the empty fields', 'error');
highLightEmptyFields();
//return false;
return;
}
// check if username is in right format
if (!(regexTester(/^[A-Za-z0-9_]+$/g, usernameField.value))) {
displayInfoMessage('Username not valid', 'error');
highLightTextField(usernameField);
//return false;
return;
}
// check if username is atleast 3 characters long
if (usernameField.value.length < 3) {
displayInfoMessage('Username should contain atleast 3 characters', 'error');
highLightTextField(usernameField);
//return false;
return;
}
// check if password is in right format
if (!(regexTester(/^[A-Za-z0-9_]+$/g, passwordField.value))) {
displayInfoMessage('Password not valid', 'error');
highLightTextField(passwordField);
//return false;
return;
}
// check if password is atleast 6 characters long
if (passwordField.value.length < 6) {
displayInfoMessage('Password should contain atleast 6 characters', 'error');
highLightTextField(passwordField);
//return false;
return;
}
//return true;
// submit form information to server via ajax
ajaxFormSubmit();
}
// add submit event listener on login form
loginForm.addEventListener('submit', validateForm);
Inside the <head></head> elements of your HTML structure, add the following code:
<script type="text/javascript">
// Wait for the document to load
document.addEventListener("DOMContentLoaded", function(event) {
// Add event listener to form submit
document.querySelector(".login-form").addEventListener("submit", function(e) {
// Prevent the form from being submitted
e.preventDefault();
// Perform displayErrorBlock() function
validateForm();
// Create native XMLHttpRequest object
var xhr = new XMLHttpRequest();
// Set POST request header leaving second parameter empty because PHP
// code is in the same file.
xhr.open('POST', '');
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.onload = function() {
// Everything was ok, handle response
if (xhr.readyState === 4 && xhr.status === 200) {
// Succesful login. Redirect user
if(xhr.responseText === 'succes'){
window.location.replace("https://your_website.com/admin dashboard.php");
}
// Wrong username / password
else if(xhr.responseText === 'errorUserPass'){
displayErrorBlock("Incorrect Username/Password");
}
// User doesn't exist
else if(xhr.responseText === 'errorNotRegistered'){
displayErrorBlock("Entered Username isn't registered");
}
// Something else was returned by PHP
else {
displayErrorBlock("Unknown error: "+ xhr.responseText);
}
}
// Request failed, alert error
else if (xhr.status !== 200) {
alert('Request failed. Returned status of ' + xhr.status);
}
};
xhr.send(new FormData(document.querySelector(".login-form")));
});
});
</script>
I've commented on most lines to explain what they do. Next you'll have to change your form to:
<form class="login-form" method="post" action="">
As we've created a custom event handler on the form, everything is controlled from there. So it's no longer needed to do this in your HTML structure.
Lastly you'll need to change your PHP code in such a way that it returns the correct responses:
Replace: header('Location:admin dashboard.php'); with echo 'succes';
Replace: echo '<script>displayErrorBlock("Incorrect Username/Password")</script>'; with echo 'errorUserPass';
Replace: echo '<script>displayErrorBlock("Entered Username isn\'t registered")</script>'; with echo 'errorNotRegistered';
As I said in the comments, it's been a while since I did this in native JS. I was unable to actually test this code, so let me know if something is wrong. Or at least it should help you into the right direction.

All users been blocked after login

I am creating a login form which if the user tries 3 input login it will automatically block. but the problem is after 1 login only it already block. and All the users have been blocked. I want only after 3 times the username that i input will be blocked. Can someone help me?Thank you.
here is my code...
<!DOCTYPE html>
<?php
function p(){
$xmldoc=new DOMDocument();
$xmldoc->load('person.xml');
$root=$xmldoc->documentElement;
$data=$root->getElementsByTagName('user');
$status="Blocked";
if($data){
$domelemupdate=[];
foreach ($data as $domElement) {
$domElement->childNodes->item(5)->textContent=$status;
}
}
foreach ($domelemupdate as $domElement) {
# code...
$domElement->parentNode->replaceChild($domElement);
}
$xmldoc->save('person.xml');
}
?>
<html>
<head>
<body>
</body>
</head>
</html>
var ctr=0;
window.login = function(e)
{
if (document.frmlogin.login_username.value == "")
{
alert("User name is not blank");
return;
}
else if(document.frmlogin.login_pass.value == "")
{
alert("Password is not blank");
return;
}
else
{
var xmlDoc;
var x;
var txt = "";
if (window.XMLHttpRequest) {
xhttp = new XMLHttpRequest();
} else { // IE 5/6
xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.overrideMimeType('text/xml');
xhttp.open("GET", "person.xml", false);
xhttp.send(null);
xmlDoc = xhttp.responseXML;
var ktra=false;
var xml=xmlDoc.childNodes[0];
var name = xml.childNodes["username"];
var pass=xml.childNodes["password"];
var status=xml.childNodes["status"];
for(var i=0;i<xml.childNodes.length;i++){
if(xml.childNodes[i].nodeName=="user"){
name = xml.childNodes[i].childNodes[3];
pass = xml.childNodes[i].childNodes[5];
status = xml.childNodes[i].childNodes[7];
position = xml.childNodes[i].childNodes[9];
if(name.textContent==frmlogin.login_username.value && pass.textContent==frmlogin.login_pass.value && status.textContent== "Active")
{
alert("Login Success!");
}
}
if(ktra==false)
{
ctr+=1
alert("Login Failed !!!" +ctr);
if(ctr==3){
//alert("You are now Blocked!!!" );
x=p()
alert(x);
}
}
}
}
</script>
Whenever i call the function in my ctr==3 .If i run the program,if for example i try first login wrong username . after i click login the text easily update to block,.i want my counter 3 times before it will be block and i want the user that i input will be blocked only not all the users
You should be keeping track of the failed count either in a database, or write to the XML file an incremental count each time they fail to login with valid credentials..

Passing values from ajax to php class functions

Q. Is there a way to pass values from ajax to a certain php class having functions? Let's say validating a username on the registration form whether the user exist or not.
This is a simple form that will accept username and has a span tag to display the message.
<form action="" method="POST">
<input type="text" name="username"><span class="check"></span>
<input type="submit" name="signup">
</form>
And for the php class:
<?php
class User {
function isUserExist($username) {
$query = mysql_query("SELECT username FROM users WHERE username='$username'");
$result = mysql_num_rows($query);
return ($result !== 0 ? true : false);
}
}
?>
It is initialized on the php class that established connection to the database.
So calling to the php page will become like this: $user->isUserExist($_POST['username']);.
So is it possible to pass values from the form to ajax and send it to the php class function?
From Html to ajax
var username = $("input[name='username']").value;
Fetch in ajax & Send it to php(server)
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
//set your span to this -> xhttp.responseText;
}
};
xhttp.open("POST", "your php script url", true);
xhttp.send("username="+username);
Receive it on the server(php)
$mUsername = $_POST['username'];
echo $mUsername;
Read this tutorial for more help
Tutorial on PHP + AJAX
Try this,
<script type="text/javascript">
$(document).ready(function(){
$("input[name = 'signup']").click(function(e) {
var username = $("input[name = 'username']").val();
$.ajax ({
url: "isUserExist_function_existing_file.php",
data: { username : username },
success: function( result ) {
if(result)
alert("Name allready Exist");
else
alert("Name available");
}
});
});
});
</script>

AJAX email form will not submit

I have an email sign-up form on my site that I recently added validation to.
Now, the form will not send or provide an error message. When I check the inspector I see the following error:
TypeError: null is not an object (evaluating 'document.getElementById(update[0]).innerHTML = update[1]')
This is my contact.php file
<?php
$to = "hello#interzonestudio.com";
$subject_prefix = "";
if(!isset($_GET['action']))
$subject = "Newsletter Sign Up"; //The senders subject
$message = trim($_GET['email']); //The senders subject
$email = trim($_GET['email']); //The senders email address
if (!filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
mail($to,$subject,$message,"From: ".$email."");
echo 'contactarea|<div id="thanks">Thank you. We promise you won’t regret it.</div>';
else {
echo("$email is not a valid email address");
}
?>
This is my form in HTML
<div id="contactarea">
<span style="font-family: 'Old Standard TT', serif;">Newsletter</span>
<form id="contactform" name="contactform" >
<input class ="email" type="text" name="email" id="inputbox" value="E-Mail"
onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/>
<input type="submit" value="Submit" name="send" onclick="sendemail(); return false; " class="signup" >
</form>
</div>
and this is my javascript
<script language="javascript">
function createRequestObject() {
var ro;
var browser = navigator.appName;
if (browser == "Microsoft Internet Explorer") {
ro = new ActiveXObject("Microsoft.XMLHTTP");
} else {
ro = new XMLHttpRequest();
}
return ro;
}
var http = createRequestObject();
function sendemail() {
var email = document.contactform.email.value;
document.contactform.send.disabled = true;
http.open('get', 'contact.php?email=' + email + '&action=send');
http.onreadystatechange = handleResponse;
http.send(null);
setTimeout(function() {
jQuery(document).find("#thanks").fadeOut();
}, 3000);
}
function handleResponse() {
if (http.readyState == 4) {
var response = http.responseText;
var update = new Array();
if (response.indexOf('|' != -1)) {
update = response.split('|');
document.getElementById(update[0]).innerHTML = update[1];
}
}
}
</script>
Any insight would be greatly appreciated.
I think this is what you are looking for:
document.contactform.send.disabled=false;
add another div in html page with id = "msg"
replace
document.getElementById(update[0]).innerHTML = update[1];
with
you can add conditions here
depending on what you want to display upload[0] or upload[1]
document.getElementById('msg').innerHTML = update[0]+update[1];
and in contact.php
there is '}' missing before else.
Multiple errors, client and server-side.
Changes to javascript. Your form data wasn't being sent in the php call.
I have made changes to your call type get/post and used new FormData(). If you want to add more to your call formdata.append("ParamName", Value/Variable); and use $something=$_POST['ParamName']; to get the post in PHP.
var formdata = new FormData();
formdata.append("email", email);
formdata.append("action", "send");
http.open('POST', 'contact.php');
http.onreadystatechange = handleResponse;
http.send(formdata);
Changes to PHP. You missed the opening/closing of the if statements.
The way you have your javascript setup, you split the php reply (|) if the email posted wasn't valid you would cause a JS error because you didn't have the divID and bar(|) in your echo.
$to = "hello#interzonestudio.com";
$subject_prefix = "";
if(isset($_POST['action'])){ // ***** Missing ({)
$subject = "Newsletter Sign Up"; //The senders subject
$message = trim($_POST['email']); //The senders subject
$email = trim($_POST['email']); //The senders email address
if (!filter_var($email, FILTER_VALIDATE_EMAIL)===false) {
mail($to,$subject,$message,"From: ".$email."");
// **** Div ID Missing with Bar (contactarea|)
echo 'contactarea|<div id="thanks">Thank you. We promise you won\'t regret it.</div>';
// **** Else missing (})
}else {
echo("contactarea|$email is not a valid email address");
}
}// **** Close if issset (})
I hope I have covered all your problems in this answer.
If you don't understand anything please leave a comment below, i will update the answer to help you understand anything within this answer. I would rather you take this source code understand it, not just a copy paste. You won't learn from copy/paste.
Tip: Clean your php string before putting them into mail().
I hope this helps. Happy coding!

<a href> link wont work when loaded with javascript

I have a very small page being managed by some javascript. When I load the page into the browswer the link after the form (id=login_linker) works fine.
However, when I load it into a div the same link wont work. Does anyone have any ideas.
Here is the body of the page that is being included.
<body>
<p>Forgot your password?</>
<form name="forgotpassform" id="forgotpassform" onsubmit="return false;">
<label for="email">Email: </label>
<input id="email" type="text" class="searchbox" onfocus="emptyElement('status')" maxlength="35">
<input type="button" style="margin-top: 15px; position:relative; left:50px;" id="forgotpassbtn" onclick="forgotpass()" value="Send me a new password">
<br>
</form>
<span id="emailstatus"> </span>
<span id="status"></span>
Log In
</body>
The javascript:
function forgotpass(){
var e = _("email").value;
var status = _("status");
var forgotpassform = _("forgotpassform");
if(e != ""){
_("forgotpassbtn").style.display = "none";
status.innerHTML = 'please wait ...';
var ajax = ajaxObj("POST", "forgotpass.php");
ajax.onreadystatechange = function() {
if(ajaxReturn(ajax) == true) {
if(ajax.responseText == "no_user"){
status.innerHTML = 'There was no matching email in the system.';
_("forgotpassbtn").style.display = "block";
} else if(ajax.responseText =="email_not_sent"){
status.innerHTML = 'There was a problem sending your temporary password.';
} else {
//status.innerHTML = ajax.responseText;
forgotpassform.innerHTML = "You have sent a temporary password to your email address. Please check your email.";
}
}
}
ajax.send("e="+e);
} else {
status.innerHTML = "Please enter your email address.";
}
}
function emptyElement(x){
_(x).innerHTML = "";
}
function loadlogin(){
$('#loginwindow').toggle(400);
$('#loginwindow').load("forgotpass.php");
$('#loginwindow').toggle(400);
}
$(document).ready(function(){
$(document).on('click', '#login_linker', function(){
alert('ok');
showlogin();
});
});
function showlogin(){
$('#loginwindow').load("login.php");
$('#loginwindow').toggle(400);
}
Here is the script to load the forgot password page ie the HTML above
function forgotpass(){
$('#loginwindow').toggle(400);
$('#loginwindow').load("forgotpass.php");
$('#loginwindow').toggle(400);
}
I don't know how your code to load the link using js is (it would be better if you post it too), but I guess the problem is you try to bind the event just after document is ready, and at that moment, the link isn't loaded yet. Bind it after loading it.

Categories

Resources