How to make JQueryUI dialog login form?

[ziggy786]

loginSend.js

$('#loginButton').on('click', function(){ //the id of the submit button = #loginButton
	
	var username = $('#userfield').val();
	var password = $('#passfield').val();
	
	if (username.length == 0 || password.length == 0 || password.length < 6) { // checks if username and pass have been entered
	
		$('#fillFields').text('*Please enter a valid username/password'); //#fillfields = the div where error message should appear in JQuery UI dialog box
	} else {
		
		//$('#formLogin').text('You have successfully logged in').dialog('close'); //Closes dialog box if logged in currently not in use
		$.post('loginProcess.php', {username: username, password: password}, funtion(data){ // sends data to loginProcess.php
		
			if (data == true){ //checks if the loginProcess has returned true (if the username exists or not)
				alert('true'); // just to check if the code works, display an alert message
			}
	}
		
	});
});

loginProcess.php

<?php

require 'config.php';

//  LOGIN FORM Process

if (user_exists('super')){ //user_exists() = a user defined function in config.php
	return true;
}
?>

config.php

function sanitize($data){
	return mysql_real_escape_string(strip_tags($data));
}

function user_exists($username){

	$username = sanitize($username);
	$query = mysql_query("SELECT COUNT(`id`) FROM `users` WHERE `Username` = '$username'");
	return (mysql_result($query, 0) == 1) ? true : false;
}

i don't understand what i've done wrong. I'm trying to create a JQuery UI dialog, login form. Normlly when the user types in a username i want it to check if the username exists. But nothing happens. Since i added JQuery Post it doesn't work. How do i get it to display if username exists or not. I think the problem is in $.post because before i added that, my code works, but after i added it it stopped working. It doesn't even display error messages? The whole code just doesn't work.

How do i fix this and get it to work as intended?

Thanks

[Fou-Lu]

Originally Posted by ziggy786

. . . Since i added JQuery Post it doesn't work.

Indicating a problem with the JQuery, and not that of PHP. If it worked before adding the JS, the server is capable of processing properly, and its the JS that's not sending the proper data.

PHP wise, you obviously don't want to be hard coding a string into the user_exists function call. There's also a another discrepancy here:

PHP Code:

if (user_exists('super')){ //user_exists() = a user defined function in config.php
    return true;
} 


You are returning in the dummy main. That may carry no value depending on usage; given what I see here, you should be printing true, not returning it.

I don't do JS programming, but these sure stand out as a problem: username: username, password: password.

Fix up the PHP code first, than fix up the JS.

[BiztechExperts]

From my side

$('#loginButton').on('click', function(){ //the id of the submit button = #loginButton

var username = $('#userfield').val();
var password = $('#passfield').val();

if (username.length == 0 || password.length == 0 || password.length < 6) { // checks if username and pass have been entered

$('#fillFields').text('*Please enter a valid username/password'); //#fillfields = the div where error message should appear in JQuery UI dialog box
} else {

//$('#formLogin').text('You have successfully logged in').dialog('close'); //Closes dialog box if logged in currently not in use

$.post('loginProcess.php', {username: username, password: password}, function(data){ // sends data to loginProcess.php

if (data == true){ //checks if the loginProcess has returned true (if the username exists or not)
alert('true'); // just to check if the code works, display an alert message
}

});
}
});