jquery.ui.touch.punch.js script is preventing input functionality on touch devices

Question

It took me a little bit, but I figured out that I can\'t click on my inputs because of the touch.punch script I\'m using to enable jquery UI drag functionality on touch devices.

Answer 1

Throttlehead's solution worked for me. Simpler perhaps to just use the JQuery selectors to cover all inputs and textareas:

    $('input,textarea').bind('click', function(){
    $(this).focus();
});

Answer 2

Folks, the other two answers here did NOT work for me, but Danwilliger's solution works; however, it's not clear from his answer how exactly to set it up in the Touch Punch JS file. For future answer-seekers, here's what to do. Again, this is Danwilliger's solution -- I'm just clarifying.

Change this section in jquery.ui.touch-punch.js (on approximately line 30):

function simulateMouseEvent (event, simulatedType) {

// Ignore multi-touch events
if (event.originalEvent.touches.length > 1) {
  return;
}

event.preventDefault();

var touch = event.originalEvent.changedTouches[0],
    simulatedEvent = document.createEvent('MouseEvents');

To this:

function simulateMouseEvent (event, simulatedType) {

// Ignore multi-touch events
if (event.originalEvent.touches.length > 1) {
  return;
}
var touch = event.originalEvent.changedTouches[0],
    simulatedEvent = document.createEvent('MouseEvents');

//Check if element is an input or a textarea
if ($(touch.target).is("input") || $(touch.target).is("textarea")) {
    event.stopPropagation();
} else {
    event.preventDefault();
}

Best of luck!

Answer 3

I actually tried adding the lines which Danwilliger mentioned, it did not do the trick for me.

What worked for me was

//Check if element is an input or a textarea
if ($(touch.target).is("input") || $(touch.target).is("textarea")) {
  event.stopPropagation();
  $(touch.target).focus();
} else {
  event.preventDefault();
}

I am not really sure why the other answers posted did not work, but for anyone else out there if they have the same issue try my solution out :).