travisco87 Posted December 2, 2013 Share Posted December 2, 2013 Hello All, I am doing a tutorial on username availability using AJAX for immediate username validation. I have made it from the tutorial but decided to use PDO instead of the old "mysql" statements just FYI, I do not think it play's into the issue but might. I keep getting this error from my Chrome console Uncaught TypeError: Object [object global] has no method 'addEvent' I researched the error and made sure MooTools is up and running on my index page but this did not solve my issue. Any help would be much appreciated, here is my code index.php <html> <head> <title>Username Availability</title> <link rel="stylesheet" type="text/css" href="style/style.css"> <script type="text/javascript" src="js/main.js"></script> <script src="//ajax.googleapis.com/ajax/libs/mootools/1.4.5/mootools-yui-compressed.js"></script> </head> <body> <div id="container"> <div id="content"> <fieldset> <form method="post" action="js/json.php" id="signup"> <ul class="form"> <li> <label for="user_name">Username</label> <input type="text" name="user_name" id="user_name" /> </li> <li><input type="submit" value="Sign Up Now!" /></li> </ul> </form> </fieldset> </div> </div> </body> </html> main.js window.addEvent('domready', function() { alert('The DOM is ready!'); $('user_name').addEvent('keyup', function(){ new Request.JSON({ url: "json.php", onSuccess: function(response){ if (response.action == 'success') { $('user_name').removeClass('error'); $('user_name').addClass('success'); } else { $('user_name').removeClass('success'); $('user_name').addClass('error'); } } }).get($('signup')); }); }); json.php <?php $config['db'] = array( 'host' => 'localhost', 'username' => 'username', 'password' => 'password', 'dbname' => 'database' ); try { $DBH = new PDO('mysql:host=' . $config['db']['host']. ';dbname=' .$config['db']['dbname'], $config['db']['username'], $config['db']['password']); $DBH->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $DBH->setAttribute(PDO::ATTR_EMULATE_PREPARES, false); $DBH->exec('SET CHARACTER SET utf8'); } catch (PDOException $e) { echo 'Connection failed: ' . $e->getMessage(); } $result = null; $user_name = mysql_real_escape_string($_POST['user_name']); $stmt = $DBH->prepare("SELECT user_name FROM ajax_users WHERE user_name = :user_name"); $stmt->bindParam(':user_name', $user_name); $stmt->execute(); $result = $stmt->fetch(PDO::FETCH_ASSOC); if ($result == 0){ $result['action'] = 'success'; } else { $result['action'] = 'error'; } $result['user_name'] = $_POST['user_name']; echo json_encode($result); ?> style.css input.success{ border: 3px solid #9ad81f; } input.error{ border: 3px solid #b92929; } The database is called "stuff" and it has a table called "ajax_users". If something turned off? I am not sure where to go with this one. Thanks for the help in advance Quote Link to comment Share on other sites More sharing options...
gristoi Posted December 3, 2013 Share Posted December 3, 2013 $('user_name') should be $('#user_name') Quote Link to comment Share on other sites More sharing options...
travisco87 Posted December 3, 2013 Author Share Posted December 3, 2013 It is not changing the input section. For some reason it wont let me change the border. I changed all of the tags to #user_name but still nothing for the input box border color change. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.