homepage Welcome to WebmasterWorld Guest from 174.129.163.183
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe to WebmasterWorld
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Jquery UI Ajax Login
LinusIT




msg:4466837
 6:39 pm on Jun 18, 2012 (gmt 0)

I was using Fancybox for a dialog style login but since discovering Jquery UI and Ajax I thought I'd change things around on my site. I can think of many uses for the Jquery UI framework and Ajax, it's just learning it that's slowing me down.

I've tried to get it working but need some help on the last part (funnily the most important part)

Simple HTML:

<div id="login-form" style="display:none">
<p class="validateTips">All form fields are required.</p>
<form>
<fieldset>
<label for="username">Username</label>
<input type="text" name="username" id="username" class="text ui-widget-content ui-corner-all" />
<label for="password">Password</label>
<input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
</fieldset>
</form>
</div>


Javascript:

<script>
$(function() {

$( "#login-form" ).dialog({
autoOpen: false,
resizable: false,
modal: true,
width: 350,
title: 'Login',
buttons: {
"Submit": function() {
var bValid = true;
var username_frm=$("#username").val();
var password_frm=$("#password").val();
var dataString = 'username='+username_frm+'&password='+password_frm;

if ( bValid ) {
$.ajax({
type: "POST",
url: "login2.php",
data: dataString,
dataType: "json",
cache: false,
success: function(html){
//alert(html); //TESTING - DOESN'T WORK
if(html=='true')
{
$("#login-form").dialog('close');
window.location.href = 'index2.php?result=success';
}
}
});
}
},
Cancel: function() {
$( this ).dialog( "close" );
}
},
});
});
</script>
<script type="text/javascript">
jQuery(document).ready(function() {
$( "#login-form" ).dialog( "open" );
});
</script>


Shortened PHP:

if($login_result) {
if(mysql_num_rows($login_result) == 1) {
$users = mysql_fetch_assoc($login_result);
echo "true";
} else {
echo "false";
}
}else {
die("Query failed");
}


The dialog is being displayed on page load, this is just for easy testing purposes. When I fill the two fields and press Submit nothing happens. I have looked at all the other Ajax code I've got but can't suss out why nothing is happening.

Would appreciate some guidance :) thanks

 

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved