OK so I am going slightly insane. I am trying to do a simple thing that I have managed many times in the past, and that is to send data through jquery .get function via a simple onClick attribute.
I have checked that the jquery.js file is loading correctly through firebug’s “net” panel, I have tried loading the jquery script from within the tag and also just before the tag; always using $(document).ready(function() { } wrapped round the script.
I just dont know what else to check to find the error.
The error is listed in firebug’s console as “…. is not defined”
Below you can find the code I am using, any help would be great; I am hoping I have simply been daft and missed a ; or something.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
function productString(product) {
$.get("http://<? echo ROOT; ?>includes/forms.php", { product: product }, function(data) {
//$('#popup-content').html(data);
alert('Load was performed.');
});
}
});
</script>
</head>
<body>
<form>
<input type="radio" value="tester" onClick="productString(this.value)">
<label>Test 1</label>
</form>
<a href="#" name="test" onClick="productString('tester2')">This is a test</a>
</body>
Thank you in advance for any help community.
The reason this is not working is that productString exists in the namespace defined by the anonymous function you pass to
$(document).ready. When the browser acts on the onclick it is looking for the function in the global namespace and so doesn’t find it. As the function does not rely on any of the DOM having been processed you do not need to wrap it in$(document).ready.