I have a form like this HTML:
<div id="dialogGlobal" title="About You">
<form>
<fieldset style="border: none;">
<ul style="list-style-type: none; padding-left: 0px">
<li><label for="username">Please Enter Your First Name</label></li>
<li><input type="text" name="username" id="username" placeholder="Enter your name" pattern="[A-Za-z]{3,}" title="Your first name must be at least 3 letters" class="text ui-widget-content ui-corner-all" required></li>
<li><label for="zipcode">Please Enter Your Zipcode</label></li>
<li><input type="text" name="zipcode" maxlength="5" pattern="[0-9]{5}" id="zipcode" title="Please enter a 5 digit zip-code" placeholder="02134" class="text ui-widget-content ui-corner-all" required></li>
</ul>
</fieldset>
</form>
</div>
And the corresponding JQuery-ui javascript
dialogGlobal = $( "#dialogGlobal" ).dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
position: {
my: "center center",
at: "center center",
of: "#map"
},
buttons: [{
text: "Submit",
click: function() {
if(checkValues();){
dialogGlobal.dialog("close");
}
else{
alert("Invalid input");
}
}
},
id: "globalAccept"
}],
close: function() {
},
//Hack to avoid "ENTER" leading to a new page...
open: function(){
$("#dialogGlobal").keydown(function(e) {
if (e.keyCode == $.ui.keyCode.ENTER) {
$("#globalAccept").trigger("click");
}
});
}
});
When I click on "Submit" in FF and Chrome, everything works fine. In IE 11 (on a Surface RT), nothing happens, I even added an alert that would signal the button was clicked but it doesn't pop up. I tried adding an $("#dialogGlobal").on("click",function(){dothesamething}); but still nothing even though other objects with that listener behave normally....
