Jquery mobile radio button not always setting the underlying input on click

Question

I have a jqm radio button that looks like this:

<div data-role="controlgroup" data-type="horizontal">
                <h3>Type</h3>
                <input type="radio" name="type" id="deposit_typeTotal" value="t" checked/>
                <label for="deposit_typeTotal">Total</label>
                <input type="radio" name="type" id="deposit_typeIndividual" value="i"/>
                <label for="deposit_typeIndividual">Individual</label>

 </div>

It's part of a phonegap application which I'm currently testing on an android galaxy s2, which is where I'm seeing the problem. I've never been able to get it to break in Google Chrome on the desktop.

I have an click event attached to this button which calls a function which does various things, but I've modified it to alter the title to the value of the button to aid my debugging.

var type = $("#deposit input[name=type]:checked").val(); // Gets the value of the checked button
app.count++;$(".depositOrPayment").html(app.count+"/"+type); // Sets the title of the page

So what I'm seeing is the number of times the function has been called / t or i depending on which button I click. However, sometimes (particularly if I click the buttons quickly) I get undefined as the button's value. Once this happens, it stays as undefined no matter how many clicks I do.

Anybody got any ideas?

Cheers

Graham

Answer 1

There is a difference between click and tap. A tap has about a 300ms delay (around that). Anyway, you can also bind to the tap & click event in JQM (virtual mouse events).

$('#element').on('tap', function() {
...
});

or

$('#element').on('click tap', function() {
...
});

Read this: http://phonegap-tips.com/articles/fast-touch-event-handling-eliminate-click-delay.html

So there is FastClick https://github.com/ftlabs/fastclick

Check this out What is the difference between the click and tap events?

And this http://phonegap-tips.com/articles/fast-touch-event-handling-eliminate-click-delay.html

EDIT: I made this a wiki in the hopes that someone can answer it better than me :)