Log in

View Full Version : jQuery ajax help


keyboard
04-13-2012, 07:36 AM
I really struggle with jQuery so just stick with me.



<script type="text/javascript">
jQuery(function($){
var field1 = $('#loginUser');
var field2 = $('#loginPass');
$('#loginSubmit').click(function(){
jQuery.ajax({
url: '<?php echo $host; ?>login.php',
type: 'post',
data: 'field1value=' + field1.value() + '&field2value=' + field2.value,
success: function(results){
alert(results);
alert("hi");
}
});
});
});
</script>
<form>
<input type="text" name="username" id="loginUser" value="Username" onclick="clear1(this)" onblur="fill1(this)">
<input type="text" name="password" id="loginPass" value="Password" onclick="clear2(this)" onblur="fill2(this)">
<input type="button" name="loginSubmit" id="loginSubmit" value="Log In" Style="background-color:brown;border:none;">
</form>


It doesn't work. When I click the button nothing happens.
Any help?
jscheuer1
04-13-2012, 02:40 PM
There could also be other problems but the value of a jQuery form element object is .val() not .value() or .value:


data: 'field1value=' + field1.val() + '&field2value=' + field2.val(),
keyboard
04-14-2012, 09:57 AM
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
jQuery(function($){
var field1 = $('#loginUser');
var field2 = $('#loginPass');
$('#loginSubmit').click(function(){
jQuery.ajax({
url: '<?php echo $host; ?>login.php',
type: 'post',
data: 'field1value=' + field1.val() + '&field2value=' + field2.val(),
success: function(results){
alert(results);
alert("hi");
}
});
});
});
</script>


Any html after that just doesn't show up on the page. IE9.
Any help?
jscheuer1
04-14-2012, 02:28 PM
That is not happening here:


<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
jQuery(function($){
var field1 = $('#loginUser');
var field2 = $('#loginPass');
$('#loginSubmit').click(function(){
jQuery.ajax({
url: '<?php echo $host; ?>login.php',
type: 'post',
data: 'field1value=' + field1.val() + '&field2value=' + field2.val(),
success: function(results){
alert(results);
alert("hi");
}
});
});
});
</script>
</head>
<body>
hello
</body>
</html>

It could be that you have an unclosed html comment token:


<!--

somewhere in the source code of your page. Some browsers will error correct for that depending upon the circumstances.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.