jQuery & PHP Powered User Manager

Posted on October 5th, 2010. Written by Dave.

Here is a brief tutorial on how to create a simple and secure jQuery, MySQL & PHP user manager.

Before we start here is the final product.

Download source files here

This script and tutorial is for beginners to PHP and jQuery an is created to give an idea of how to go about creating a modern and secure user system.

A few features of the user manager are

    • Unobtrusive Ajax login box.
    • Modern CSS3 styling.
    • Tiny size (Just 8kb)
    • Slick Ajax backend.
    • Loads More..


This script uses a MySQL database to store user information and the necessary SQL is as follows :

CREATE TABLE IF NOT EXISTS `users` (
  `id` int(5) NOT NULL AUTO_INCREMENT,
  `username` varchar(50) NOT NULL,
  `password` varchar(50) NOT NULL,
  `email` varchar(50) NOT NULL,
  `reg_date` date NOT NULL,
  `confirm_code` int(50) NOT NULL,
  KEY `id` (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1;

From here on I won’t be posting any further code as to really understand how the system works you should download
the source files
and have a look.

The Login

First we’ll look at the login section. This section consists of 2 files, login.php and login_2.php. Login.php houses all the jQuery, CSS styling and HTML while the login_2.php has all the PHP which handles the login data sent from Login.php

The Registration

Login.php also has the registration box which when submitted submits an ajax request to register.php and creates a new user account.

New user registrations can also be done the admin’s user management section.

The Admin Section

Within the user manager is a simple admin section which allows you to quickly add, delete and edit users. This section uses jQuery to make almost all actions smooth and free from page refreshes.

Securing Pages

Adding protection to pages using the script couldn’t be easier, simply add the following PHP code to the top of any page you wish to secure :

<?php secure(); ?>

An example of this can be seen in the index.php file contained in the source files.

Conclusion

I hope you find this script somewhat useful in creating your own user manager and welcome and feedback / question


This entry was posted on Tuesday, October 5th, 2010 at 1:19 am and is filed under CSS, MySQL, PHP, Web Design, jQuery, jQuery Plugins. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site. You can leave a response, or trackback from your own site.

Dave

Dave Earley ( Admin ) is a 19 year old Irish web developer who spends most of his time writing useless PHP / JavaScript and occasionally comes up with something worthwhile.

.
  • http://abcphp.com/story/36495/ abcphp.com

    jQuery & PHP Powered User Manager…

    A small PHP & jQuery user manager script which can be used as is or as a starting point in a more complex user management system….

  • nicoSWD

    This is horribly insecure. STAY AWAY FROM IT! It’s vulnerable to XSS and SQL injections.

    I can just change the value in the login_u cookie, and the script would think I’m logged in.

    It has practically no validation. Just because an email address is longer than 3 characters, it doesn’t mean it’s valid.

    What’s the deal with having to put the database username/password/etc in every single file? How about include/require?

  • Anonymous

    The script was not intended to be an out of the box solution for securing a website. The idea was to just give people something on which to build their own user management systems.

    However I do agree that there was room fro improvement so I updated the source files to be more secure.

  • Sbb

    Just wanted to add that a simple logout option also would make this so much more useful.

blog comments powered by Disqus

Popular Files

  • CSS3 Mega Drop Down Menu
  • jQuery Lightbox Evolution
  • jQuery Banner Rotator / Slideshow
  • Events Calendar Pro - Wordpress Premium Plugin
  • iPhorm - Simple yet Powerful Ajax contact form
  • The Tooltip
  • Pure CSS3 Sticky Footer
  • Advanced Slider - jQuery XML slider
  • uBillboard - Premium Slider for Wordpress

Recent Posts

follow us on twitter

Rss feed
jQuery Plugins

Page optimized by WP Minify WordPress Plugin