Ok, here’s another AJAX login form example…
In this example I am using 3 javascript files, 2 php files and 1 stylesheet.
click http://joeabiraad.com/demos/ajax2 for the demo
click http://www.joeabiraad.com/demos/ajax2/ajax2.rar to download the files
Brief description:
_ajax.new.js: is the main ajax class. I have already explained this class
_formdata2querystring.js: used for posting the element of a form
_applogin.js: specific ajax class to handle the login form
index.php: simple login form
style.css: simple stylesheet
If you like it digg it
Next post will be a tutorial on how to make it
Stay tunned …
//Jo
Peace 
I’m trying download the source files, but every time I try I get a page with a bunch of nothing on it.
Why this login form enables the back button?
D.Peterson: Try to right click on the file then Save As.
Its working fine here with me
Arnulfo Arias: The login form will redirect you to welcome page when the login is correct.
To FARAWAY:
The italian article talks about “Modern (Web 2.0?) ways of dealing with HTML Forms”. The article itself is a sort of link collection.
it`s not working..
it doesn’t accept the password
hi matej, can you please tell me what browser you are using ? and if you have javascript enabled or not.
the password should be : iwannalogin ( no spaces and case sensitive )
the email should be: email@gospam.biz
kind of ugly that the password is being send in the post.
you should encrypt the password before sending it with js to php and then decrypt it again with php.
Yeah you are right,
I will do it today and update the script… thank you mister p
When i submit i’ve always this message “going somewhere ?”
i don’t know why please help me
Hi jb
in the file js/_ajaxlogin.js
go to line 105, it should be:
self.ajax.doPost(’ouf.php?action=login’, postData, self.handleLoginResp);
In your case i think it is not
check it and if u need anythg more reply
Thank’s but i’ve always the same problem
go to
http://notedeletudiant.com/ndl/test2/testlogin/
Hi jb
Im sorry for this error, you should add this line at the beginning of ouf.php ( before switch($action) ).
###
$action=trim($HTTP_GET_VARS['action']);
###
or re-download the files… i fixed them
Let me know if that worked for you
perfect!! Thank you very much
It’s not working on IE, the submit button never gets activated… any ideas?
TheMan: Can you please tell me what IE version you have ?
I tested it on IE 6 and it seems to work.
Make sure you do not copy and paste the password, because then it wont work.
Or better yet, upload somewhere on the net so i can see it
You are right Jo, it does work, i have IE 6.0, mi mistake
help for this error!
self.form.Pass has no properties
[Break on this error] self.form.Pass.value = ”;
doesnt work very well…
or something i dont understand…got the same error that max…text “welcome.html” appears in the box…
can this be due to the fact i work on local server (easyphp) ?
Hi mcnk
Can you upload your script somewhere so i can see the error ?
Could you please help me with one thing ? I need the LOG-OUT thing. I made the login case at ouf.php to save the sessions, for keeping user on the page if he will try to refresh the page, but now i dont know how to create an AJAX Request for my ‘LOGOUT’ case, which i made and filled with session_unset(); session_destroy(); and etc. Could you please help me with this ? Best reguards, Tiesto )
Hi Dj Tiesto
All you have to do is add the javascript function in js/_applogin.js that will call your case at ouf.php
the function can be smthg like this:
this.a_logout(){
var self = Login;
self.ajax.doGet(’ouf.php?action=logout’, ‘text’, self.handleLogoutResp);
}
then implement the handleLogoutResp function
this.handleLogoutResp = function(str) {
var self = Login;
var respArr = str.split(’,');
var respType = respArr[0].toLowerCase();
var respMsg = respArr[1];
var respSes = respArr[2];
if (respType == ’success’) {
location = respMsg+’?'+respSes;
}
else {
self.showErrorPrompt(respMsg);
}
}
Finnally add this to the end of the _applogin.js
document.getElementById(’logout_id’).onClick = Login.a_logout;
where logout_id could be the id of ( Logout
If you need anything else tell me.
By the way can I see the website where u implemented my ajax function ?
Is it possible to have multiple login email addresses and passwords?
Google is my favorite search engine!
I agree, multiple users and the ability to change where the user ends up after hitting submit depending on their username would be great!!!
I will do second version of this login form and include the following:
1- logout
2- session/cookie for each multiple user
3- ability to redirect ppl depending on the user to a specific page
Sir, I want to create a login form, that will differentiated between the Administrator and User with their Authorty
Sir, I aslo have a problem to develop a page of on line exam, So that the User can not make copy of this form
Please reply soonly
It’s a good idea BUT…
You got some wrong things in the code.
1. you can type any email that you want
2. you don’t have to write the whole email just a letter or two.. not even the @
3. you can login how ever you want to.. you just ned the a correct password. It has nothing to do with the email.
its cool but i would prefer if it didn’t go to another page
Hi there,
Just came across this and whilst it seems to work okay if you click the button, if you press return whilst in any of the fields it will let you in no matter what you type into the fields.
Just thought you should know.
Best wishes,
Mark
This login form does not register any session/cookie.
You will have to this yourself
Thanks for this login page…. it works ……
Doesn’t want to work in IE 7
ghdfgh
self.form.ChangeAlert.checked is null or has no properties
t’s a good idea BUT…
You got some wrong things in the code.
1. you can type any email that you want
2. you don’t have to write the whole email just a letter or two.. not even the @
3. you can login how ever you want to.. you just ned the a correct password. It has nothing to do with the email.
——-
Just change:
if ($password == $good_pass){
To:
if (($password == $good_pass) && ($email == $good_email)){
yeah , thats pretty cool!
IT’S VERY NIC BUT I FOUND JS ERROR ON IE 7 IF U ENTER INCORRECT EMAIL AND PASSWORD
BUT OVERALL IT’S VERY GOOD EXCELLENT JOB
REGARDS
SALIK AHMED
When I put de User & pass text “welcome.html” appears in the box. I need to redirect another page or addresscom. Can u help me?
hi, it’s no work
same error going somewhere ?
ouf.php ( before switch($action) ).
###
$action=trim($HTTP_GET_VARS[’action’]);
### this line its ready
i am not sure what happend can u help me please
Wow!!!^
I uploaded all the files into the server it does not bring me to the welcome.html page. and i was still in the index.php page with the message display ‘ going somewhere ?’ but when i test it using localhost, it works. can you help me out with tis problem?
Hi, it wont load at all, in firefox it loads the message in the top box, but i get the error going somewhere? latest version used, in ie though, nothing, no messages nothing.. please help? Thanks
Also forgot to mention, running on IIS with php installed
Hi everone,
I have a question.
Could you please help me ?
How can a server understand when lots of users login simultaneously ?
I am working with PHP but I cant write a script for this.
thanks from now
Hi, Thats beautifullogin u implemented. I had to remake my login using ur code. but apparently the ajax part doesnt work. i have other works in ajax and they work fine. this is how it is now. wen i hit the submit button it starts loading the whole part no ajax working. and am using fire bug the error there is
self.form has no properties
http://127.0.0.1/_applogin.js?2122778914
Line 76
what could be there problem. its really frustrating me. thanx
Amazing really amazing script thank you
Very Cool Script….
I am waiting for your Version 2 : Login …
When I am downloading it, then ajax2.rar gets download but when I open it there is nothing in it.
Please help me. and send me the files to my email
thanx
cool script
great form.
but i dont understand how t use the javascript stuff.
wont open on my pc.
where do i put it in my site?
This is a nifty script
Well, it’s asked before. Do you know if it’s easy to use for a multi-login purpose. So integrate a variable which identifies the loginform.
That should be really great!! Hopefully someone can help me with this.
Thx!
Nice script, it was just what I was looking for, however, I noticed once you get to the welcome page you can bookmark it and return later bypassing the login. Is there a way to make someone always login?
nice cript. but what you do when you get to the page . how can i protect the pages and the files in the in there , so users MUST login to see the pages ?
thanks
jeff
Hi… good contribution.
Is there a way I can redirect to a url which has been typed in earlier, rather than to the welcome page.
Many thanks.
Thanks. Thanks all.
Great script, using it on my new project
thank you for share.
to Max
change self.form.Pass to self.form.password
to hone
self.form.ChangeAlert.checked is null or has no properties
in _applogin change uncoment //self.enableScreenReaderFeatures();//Joe
Hello!
I wondered if you planned a review & update of that script. It’s wonderful that way, but some options which are probably easy for any experienced PHP/MySQL coder would be awesome…
-Register form
-MySQL for accounts storage
-A mini admin panel allowing to add/delete accounts and to modify informations
-Sessions: to remember when the user has logged-in.
That’s all. Also, you promised us a tutorial and I haven’t seen it… is it still planned?
Regards,
Fox
Also, maybe a bit more secured features…?
Hi,
i have this message:undefined, and i don’t know why. Help me please.
Adress of website: http://jbv.ced.travel/connexion_utilisateur.php
hi,
i need to refresh two / {whatever is possible} at one time by clicking a button but not refreshing the other fields of a form, nor by posting other fields , it should just work as the captcha refresh works, and refreshes the captcha code by interfering the rest of the fields. A help will be highly appreciated and thankful.
hi,
i am trying to use the script on one of my site i was trying without chaining any of the script but still i get the error
“going somewhere ?”
i have this line in code as mentioned above
$action=trim($HTTP_GET_VARS['action']);
and this below line also
line numner 105, it is :
self.ajax.doPost(’ouf.php?action=login’, postData, self.handleLoginResp);
still i get the error can u help me please
its working thx guys..
thank you for share
How to “enable” the submit button “only” once all validation completes?
If the validation is not complete, no submit.
Is it possible and how to enable this function?
Cheers
Forgot to add.
I have used this to validate against the database by means of username, email address and would only like to allow the submit button to be available or enabled once the validation is happy:)
Cheers
Wow, thanks a lot for this one.
greetings from Amsterdam.
If Your On A Mac It Works So Perfectly! THANK YOU!
Thank you very much mr.
The login.php file in the current rar file seems to only be a partial file. The file ends with ‘<’.
Hi dude its just displaying “going somewhere ?” :-S
finally got it man… thnx for d nice idea
great work, thanks
thank you for this script
hello,
when i tried to run i got this error..
Warning: Unknown: failed to open stream: Permission denied in Unknown on line 0
Fatal error: Unknown: Failed opening required ‘/var/www/apache2-default/ajax/login1/index.php’ (include_path=’.:/usr/share/php:/usr/share/pear’) in Unknown on line 0
please help me soon
This works beautifully…locally (XAMPP). However, on my host, it doesn’t, and returns the “going somewhere?” response. So for those with the “going somewhere?” error, it may be the way the Ajax is handled on your host.
The solution to my “going somewhere?” error was that my host ignores $HTTP_GET_VARS. Changing that to $_GET resolved the issue.
Hi,
nice script!
Is there going to be an update to it any time soon?
Many thanks for sharing.
I will do it today and update the script… thank you
Hey, awesome work.
Is there any way to hide the password and login names in ouf.php, if someone wanted they could check the source of the index.php, then download the accompanying js files and figure out it’s routed to ouf.php and then they download ouf.php and then whala, login and password. Is there a way to remove this capability?
I like what you’ve done, taught me quit a lot so far.
its working exactly.
Thanks…………
Thanks you very much all ready again.
Fantastic script Jo. Had to tweak a few codes to make it work for us, but it works wonderfully.
this thing isn’t even available anymore? no demo no zip file? k
very nice scripts thanks for sharing this. keep it up!
let someone send the code to my email: waleshoola@yahoo.com. thanks
@Shoola:
http://www.joeabiraad.com/demos/ajax2/ajax2.rar
Can you please provide more details on this?
Hi Joe !
Can you post an example of AJAX contact form ?
Thanks !
Hello webmaster
I would like to share with you a link to your site
write me here preonrelt@mail.ru
thanks for sharing
Was ist das?
how to access database values in ouf.php
i tried to compare user name and password from database
its not working
lopll;;
hi
thanx
I’m just downloaded the zip file and threw it on the wamp server as is and when the index page fist launches, i get a “less then” operator in the lower left hand corner which indicate to me that there is something off with the code. But I went ahead to try to log in with the hint you provide but nothing registrars in the box. Anyone else experience this? Also i see in the index page there’s 2 js code that have ?” withing the call but should it have <?php in that call?
Can it work on IE8?
Great article, again. These informations are especially useful …
how to make it? please…
Hey there!
So far, your script is working really well for me.
I am having a huge problem that is driving me up the wall, though.
When submitting my form, the link in which I would like to be redirected to is shown. My guess is it’s a problem with the server on handling everything, but I really need the redirect to work. I’ve tried other ways around it, but since the responseFormat and whatnot are all set to text/XML/object and I can’t seem to get it to anything with HTML- I can’t get a redirect at all. Please please please help me out as quickly as possible!
-Alexander
nice tutorial.. thx