jQuery ajax help

**keyboard** · 04-13-2012, 07:36 AM

I really struggle with jQuery so just stick with me.

Code:

<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:

Code:

data: 'field1value=' + field1.val() + '&field2value=' + field2.val(),

**keyboard** · 04-14-2012, 09:57 AM

Code:

<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:

Code:

<!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:

Code:

<!--

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.

Thread: jQuery ajax help

Thread Tools

Search Thread

jQuery ajax help

Bookmarks

Bookmarks

Posting Permissions