Form won't submit when navigated too but will work when accessed directly?

Form won't submit when navigated too but will work when accessed directly?

I'm developing a mobile application using phonegap and trying to integrate a form using jquery to post data to an sql database but the form seems to acting in a strange way. 
If I set the application to navigate directly to the form page upon startup of the application it works fine but if I try to navigate to the form page from an different initial page the form will refuse to work.
The problem seems to be with declaring the jquery script on the first initial page.
If anybody has any idea what's going on that would be great because I just can't figure it out!

HTML from the first page navigating to the form page
  2. <!DOCTYPE HTML>
  3. <html lang="en-US">
  4. <head>     
  5. <title>jQuery form post</title> 
  6. <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
  7.    
  8. </head>
  9. <body>
  10. <div data-role="page" class="ui-responsive-panel" >
  11. <div data-role="header" >
  12. <h1>New Submission</h1>
  13. </div>

  15. <div data-role="content">

  17. <a href="comment_2.html" data-role="button" data-transition="slide" data-icon="arrow-r" data-iconpos="right">Submit new location</a>

  19. </div>
  20.    
  21. </body>
  22. </html>

HTML from the form page... this works on it's own but doesn't when you navigate to it.
  2. <!DOCTYPE HTML>
  3. <html lang="en-US">
  4. <head>     
  5. <title>jQuery form post</title>   
  6. <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
  7. <script src="js/post.js"></script> 
  8. </head>
  9. <body>
  10. <div data-role="page" class="ui-responsive-panel" >
  11. <div data-role="header" >
  12. <h1>New Submission</h1>
  13. </div>

  15. <div data-role="content">

  17. <div id="landmark-1" data-landmark-id="1">
  18. <form id="comment">
  19. <label for="email">
  20. <b>Email</b>
  21. <input type="email" id="email" name="email">
  22. </label>

  24. <label for="comment">
  25. <b>Comment</b>
  26. <textarea id="comment" name="comment" cols="30" rows="10"></textarea>
  27. </label>
  29. <input type="submit" value="Save">
  30. </form>
  31. </div>

  33. </div>

  35. </body>
  36. </html>

Javascript of form
  2. $(function(){
  3.     $('#comment').submit(function(){
  4.         var landmarkID = $(this).parent().attr('data-landmark-id');
  5.         var postData = $(this).serialize();

  7.         $.ajax({
  8.             type: 'POST',
  9.             data: postData+'&lid='+landmarkID,
  10.             //change the url for your project
  11.             url: 'save.php',
  12.             success: function(data){
  13.                 console.log(data);
  14.                 alert('Your comment was successfully added');
  15.             },
  16.             error: function(){
  17.                 console.log(data);
  18.                 alert('There was an error adding your comment');
  19.             }
  20.         });

  22.         return false;
  23.     });
  24. });