Hi i'm trying to use ajax to send a simple username and password to a login.php which would return 2 result being false or true. Problem is, when i click #loginbutton, it seem to be loading but nothing appears after that (no alert or page reload).
here's my script
- <script>
- $(document).ready(function(){
- $('#loginbutton').click(function() {
- $('#loginform').submit(function() { // catch the form's submit event
- $.ajax({ // create an AJAX call...
- data: $(this).serialize(), // get the form data
- type: $(this).attr('method'), // GET or POST
- url: $(this).attr('action'), // the file to call
- success: function(result) { // on success..
- if (result == 'false') {
- alert("Login failed.\n\nThe username and password doesn't match or perhaps the username doesn't exist.\n\nMake sure you have checked your email and validate your account.");
- }
- else if (result == 'true') {
- alert("Thank you, the registration was successful. \nWe have sent you an email, please validate your account. \nClick OK and we will redirect you to the homepage.");
- window.location.replace("http://127.0.0.1/wordpress/");
- }
- }
- });
- return false; // cancel original event to prevent form submitting
- });
- });
- });
- </script>
and my login form (i'm trying to integrate this with wordpress, this is inserted in the header.php)
- <?php
- $templateDirectory= get_bloginfo('template_directory');
- echo'
- <form id="loginform" action="'.$templateDirectory.'/login.php" method="post" class="login">
- <a href="#" id="loginbutton" class="linkit">LOGIN</a>
- <div class="para"><input type="text" name="uname" placeholder="Username ..."> <br><input type="password" name="pass" placeholder="Password ..."></div>
- </form>';
- ?>
Anyone can please offer me some help :( ?