Am following a web developer course on-line and one of the projects is to create a fictional stock trading site.
I am using jQuery and the Validator plugin on my lookup page, but when I load it in Chrome, I keep getting Uncaught SyntaxError: Unexpected token messages, sometimes for “:”, other times its “<“.
I have looked through similar entries on the site, and tried displaying all chars and checked for matching brackets and braces (notepad++) to no avail, and have gone through the code again and again to no avail before asking for help.
The page code is below. I would really appreciate any pointers. Hopefully I haven’t missed anything silly but …
<?
require("../includes/common.php");
$userID = $_SESSION['id'];
$userQuery = $dsn->prepare("SELECT balance FROM cs75f_users WHERE uid=:uidQ");
$userQuery->bindParam(":uidQ",$userID);
$userQuery->execute();
$userData = $userQuery->fetch();
$userBalance = $userData[0];
?>
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="javascript/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="javascript/jquery.validate.js"></script>
<style type="text/css">
* { font-family: Verdana; font-size: 96%; }
label { width: 10em; float: left; }
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; }
p { clear: both; }
.submit { margin-left: 12em; }
em { font-weight: bold; padding-right: 1em; vertical-align: top; }
</style>
<script type="text/javascript"><![CDATA[
$(document).ready(function()
{
$("#search").select();
$("#infoDiv").slideUp();
$("#buyDiv").slideUp();
var searchVal = $("#searchForm").validate({
rules:{
search:{
required:true,
minlength:4,
maxlength:4
},
},
messages:{
search:{
required:"Please enter a valid stock symbol",
minlength:"Please enter a valid 4 character stock symbol",
maxlength:"Please enter a valid 4 character stock symbol"
},
},
errorPlacement: function(error,element)
{
if (element.is(":radio"))
{
error.appendTo(element.parent().next().next() );
}
else if (element.is(":checkbox"))
{
error.appendTo(element.next() );
}
else
{
error.appendTo(element.parent().next() );
}
}
});
$("#searchForm").submit(function() {
$.ajax({
url:"getquote.php",
data:{
symbol:$("#search").val()
}
success: function(data) {
$("#name").html(data.name);
$("#price").html(data.price);
$("#high").html(data.high);
$("#low").html(data.low);
$("#infoDiv").slideDown();
$("#buyDiv").slideDown();
$("#qty").select();
$("#hSymbol").val(data.symbol);
}
});
return false;
});
var buyVal = $("#buyForm").validate({
rules:{
qty:{
required:true,
min:1,
max:10000,
digits:true
},
},
messages:{
qty:{
required:"Please enter a valid quantity",
min:"You must purchase at least one share",
max:"Upper limit of 10,000 shares at one time",
digits:"Please enter a valid number"
},
},
errorPlacement:function(error,element) {
if (element.is(":radio"))
{
error.appendTo(element.parent().next().next() );
}
else if (element.is(":checkbox"))
{
error.appendTo(element.next() );
}
else
{
error.appendTo(element.parent().next() );
}
}
});
});
]]></script>
<title>CS75 Finance Login</title>
</head>
<body>
<div id="logo" align="center">
<img src="images/logo.gif" border="0" alt="CS75 Finance" />
</div>
<div id="welcome" align="center">
<h4>Welcome to CS75 Finance</h4>
<h4>Stock Information Quote</h4>
</div>
<div id="searchDiv" align="center">
<form id="searchForm">
<table border="0" cellspacing="2" cellpadding="2">
<tr>
<td>Symbol:</td>
<td><input type="text" id="search" size="10" /></td>
<td></td>
<td><input type="submit" value="Search" /></td>
</tr>
</table>
</form>
</div>
<div id="infoDiv" align="center">
<h4>Selected stock details:</h4>
Company: <span id="name"></span><br />
Price: $<span id="price"></span><br />
High: $<span id="high"></span><br />
Low: $<span id="low"></span><br />
</div>
<br />
<div id="buyDiv" align="center">
<form id="buyForm" method="post" action="buy.php">
<table border="0" cellspacing="2" cellpadding="2">
<tr>
<td colspan="5" align="center"><b>Your current balance is: $</b><? echo number_format($userBalance,2); ?></td>
</tr>
<tr>
<td><input type="hidden" id="hSymbol" /></td>
<td align="right">Qty:</td>
<td><input type="text" id="qty" name="qty" size="10" value="1" /></td>
<td></td>
<td><input type="submit" value="Purchase" /></td>
</tr>
</table>
</form>
</div>
<?
$dsn = NULL;
?>
<br />
<hr width="70%">
<p align="center">CS75 Finance. Copyright 2012. All right reserved.</p>
</body>
</html>
Hope I posted correctly. Thanks in advance.
JS hint says, you have some errors in your code. Try to fix them and check again 🙂
Line one is your $(document).ready
If you like to test it yourself: http://www.jshint.com/