Reputation: 897
I'm enabling an OK button in a jQuery dialog box based on changes to a Select field.
That part works, but when I click on OK or 'Close' in order to save that information and proceed, the following errors appear.
Chrome: Uncaught TypeError: Cannot read property 'apply' of undefined
Firefox: TypeError: d.click is undefined
... e="button">').click(function(){d.click.apply(c.element[0],arguments)})....
jquery-ui.min.js (line 14, col 5350)
var disposition; // I'm using this so that the alert('fixed') doesn't get call on load...
// Callback Disposition Dialog
$('#disposition_modal').dialog({
open: function () { // removed the default close link
$(this).parent().children(':first').children('a').remove();
},
buttons: [{
text: 'Cancel',
Ok: function () {
$(this).dialog("close");
}
}, {
text: 'OK',
disabled: true,
id: 'dm_btn',
Ok: function () {
if (disposition !== '' && undefined !== disposition) {
alert('fixed');
$(this).dialog("close");
}
}
}]
});
// toggle the OK button
$('#disposition_id_in2').change(function () {
disposition = $('#disposition_id_in2').val();
if ($('#disposition_id_in2').val()) {
$('#dm_btn').attr('disabled', false);
} else {
$('#dm_btn').attr('disabled', true);
}
});
Here's a JSFiddle distillation of the problem to its barest minimum: JSFiddle button error
Upvotes: 3
Views: 32416
Reputation: 21482
You need to change "Ok" to "click" for the buttons.
buttons: [{
text: 'Cancel',
click: function () {
$(this).dialog("close");
}
}, {
text: 'OK',
disabled: true,
id: 'dm_btn',
click: function () {
console.log(disposition);
if (disposition !== '' && undefined !== disposition) {
alert('fixed');
$(this).dialog("close");
}
}
}]
Upvotes: 3