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

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!