Hi all!
I'm working through a video tutorial on jQuery for absolute beginners ... (Hey, that's me!) ... and find myself a little stymied. The tut says I'm supposed to grab the value of these fields from an HTML form and put them in js vars for submission by AJAX to a php script. It seems to make sense, and jsFiddle seems to think my script is OK, but I get errors when I try to run this while Web Console is open in Firefox. Any thoughts?
Here's the script:
- <script type="text/javascript">
$(function() {
$('#submit').click(function() {
$('#container').append('<img src="../resources/art/loading.gif" alt="Loading" id="loading" />');
var name = ('#name').val();
var email = ('#email').val();
var comments = ('#comments').val();
console.log(name, email, comments);
return false;
});
});
</script>
I was hoping to see the values of name, email, and comments from my html form:
<div id="container">
<form name="basicForm" id="basicForm" method="POST" action="jqL4.php">
<label for="name">Name</label>
<input type="text" name="name" id="name" />
<label for="email">eMail Address</label>
<input type="text" name="email" id="email" />
<label for="comments">Comments</label>
<textarea rows="5" cols="35" name="comments" id="comments"></textarea>
<br /> <br />
<input type="submit" name="submit" id="submit" value="Go!" />
</form>
</div>
But instead, it just goes ahead and submits to the php script and to the best of my knowledge the jQuery script never runs.
Here are the errors I'm getting in Web console:
(Warning) Use of getAttributeNode() is deprecated. Use getAttribute() instead.
(Error) "#name".val is not a function
Anyone? Any thoughts you may have to get me going down the right path would be greatly appreciated!
Thanks!