Functions and plugins not functioning on second page
jQuery Mobile has been a great framework to build my website/app (using PhoneGap) but while developing it inside the desktop browser, I've discovered that my functions are not being run until the page is refreshed directly.
My app consists of 3 pages:
- intro screen to choose which language
- main form
- results page to print form inputs
I go to the second page using a link
- <a href="en/form.html" data-role="button">English</a>
and inside that second page I use the validate plugin to test the form
- <script type="text/javascript">
- $(document).ready(function() {
- // form submission
- $("#login-form").validate({
- submitHandler : function(form) {
- processLoginData(form);
- console.log("submitting...");
- }
- });
- $('#submit-button').click(function(e) {
- $("#login-form").submit()
- });
- });
- </script>
Clicking the links from the first to second page, the script is not run, but refreshing the page directly, it is. I include each script inside every page, so the script has access to all required files. Is there something about the way jQuery handles adding pages to the DOM that would prevent my scripts from running?