If you happen to use the mnhnl dynamic 1 form in the IForm Drupal module you may notice that one of the user interface options is to enable client-side validation. That would, for example, check that numeric fields only have numbers in before trying to submit to the warehouse. It makes for a more helpful and responsive user interface. However, there is a little note beside the option saying "there are bugs in Internet Explorer which can cause errors when clicking on the map if this box is ticked"

What this means is that, assuming you want to support the world's most used (and my least liked) browser then you have to make a choice between having a map for inputting location information or client-side validation. This was bad news for me recently as really needed both so I investigated.

What I found is that validation is done by the jQuery Validation plugin. This attaches a click handler to the form so that when you click on anything in the form, including the map, the module checks it to see whether it needs to validate something. jQuery is called to answer the question, "what type of thing just got clicked" and when that thing happens to be certain map-related items IE does not play nicely with jQuery. This may now be fixed in more recent versions of jQuery but we are using 1.3.2 because that is what Drupal 6 is compatible with.

I came up with a workaround to this problem but not a way to integrate my fix into the Indicia code in a generic way, hence I am documenting it here. My workaround was to skip validation if the click fell within the map. I edited my local copy of iform/media/js/jquery.validate.js and modified the event handler which is right at the end of the file

Where the original event handler reads

if (target.is(delegate)) {
  return handler.apply(target, arguments);
}

I modified it to

if (target.parents('#map').length == 0) {
  if (target.is(delegate)) {
    return handler.apply(target, arguments);
  }
}

Target is the thing that has been clicked and 'map' is the id of the <div> that contains my map so my conditional statement is saying 'if the thing clicked is not in the map div then go ahead and try to validate it'

Any improvements to this very welcome.

Jim Bacon.