I’m building a small website with JQTouch and the first problem I’ve run into yet is with a form.
I have a form
<form action='action.php' class='jqt' id='ajax_post' method='post' name='pform'>
(where the name attribute is there when I tried to access it with document.pform)and within it is a ul list of a elements as follows:
<a class="submit" href="#" value="somevalue">Text displayed</a>
Underneath, inside the form, I placed a single hidden input field (because I only want to POST one value), where my goal is to populate it by clicking one of the links and then submitting:
<input name='somename' type='hidden' />
On submission, the webserver reports that a POST was performed, and there is a brief slide animation before the page returns to the original form. Trying to hack my way into jqtouch.js to populate the input field doesn’t work (where what I’m trying is $form.somename.value = $(this).attr('value'); inside submitParentForm())
The CSS captures well and the list is displayed nicely. In fact, if I remove the submit class and insert my own form submission override with document.somename.value = %(this).attr('value'); document.pform.submit(); inside, for instance, hrefor onClick in one of the links, the POST is performed and the next page is displayed, albeit by reloading and not with a jQTouch animation, which is my goal.
My question: How can I use jQTouch to show a slide animation when I post a form which I want to populate with the value of an a element when a user clicks on it?
Thanks in advance.
I wouldn’t submit the form (if I wanted to use a submit button I’d use preventDefault). I’d just use $.post() to post the data and then jQT.goTo to go to the new page with a slide animation. The new page is in jqTouch, of course, only another div in the same document which makes it easy to set any information you’d like on that page using the response in the callback of $.post().
But this might not be a viable solution to what you’re trying to do, I don’t really understand the question very well.