Hi, I am having a problem with my jqm form not working properly in mobile browsers (iPad 1 Safari, Android Dolphin) but working as expected in desktop browsers (Chrome, Firefox, Safari & IE9 on Win7).

The form starts by asking the user how they would like to be contacted (email, sms, and/or post), then updates fields to be required based on this selection (validation is via the validationEngine.js plugin).

An example of the form can be seen here.

The logic of the script is that it checks to see if the checkbox is selected (or de-selected), then adds (or removes) a class to make it required as shown below.

1. $('body').delegate('#byEmail_label', 'click tap', (function(event) {
     if (!$("#byEmail").is(":checked")) 
      { 
   $('#req_email').addClass('reqField');
   $('#email').addClass("validate[required,custom[email]]");
     }
     else
      { 
     $('#req_email').removeClass('reqField');
   $('#email').removeClass("validate[required,custom[email]]").validationEngine('hide');
     }
   })
   );

I had this working 100% without the .delegate(), but then I could not have the form load via ajax - after adding .delegate it all works well, except in mobile browsers.

Has anyone experienced something similar, or have any idea how I can get this working?

Thanks

James