I have the following function that is called via a button click. I'm building out a form before displaying the form on a popup. The issue is the onSelect event for the Combobox, which is being triggered by a setValue within the same onSelect - this causes an infinite loop error. I can't use onChange, because onSelect passed the whole row and onChange only passes the new and olde value. I need the row object because I store a bunch of extra data in the returned json object that I use for processing:
function confirmNewThresholdDetail() {
clearFormErrors('fmThresholdDetail');
$('#ProcessType').val('New');
$('#InactiveThresholds').combobox({
url: '/ctrls/ajax.aspx?a=getInactiveThresholds&r=' + accountId + '&i=' + $('#ThresholdId').val(),
valueField: 'id',
textField: 'text',
panelHeight: 'auto',
editable: false,
formatter: function (combo) {
if (isNaN(combo.text)) {
return combo.text;
} else {
var gTh = '';
if (combo.GreaterThan == '1') { gTh = '> '; }
return gTh + formatNumber(combo.text, '###,###,###');
}
},
onSelect: function (combo) {
$('#UpperThreshold').prop('disabled', false);
$('#fmThresholdDetail').form('clear');
if (combo.id == "0") {
// new threshold
$('#AccountThresholdDetailId').val("0");
$('#ThresholdDetailId').val('0');
$('#IsStandard_Yes').prop('checked', true);
$('#GreaterThan').prop('checked', false);
$('#NmbrOfApprovers').combobox('setValue', '1');
$('#UpperThreshold').val('');
} else {
if (combo.id != "*") {
// existing inactive
$('#fmThresholdDetail').form('load', combo);
$('#IsStandard_Yes').prop('checked', true);
$('#AccountThresholdDetailId').val(combo.AccountThresholdDetailId);
$('#ThresholdDetailId').val(combo.ThresholdDetailId);
$('#ThresholdRule').text('');
$('#UpperThreshold').val(formatNumber(combo.UpperThreshold, '###,###,###'));
$('#UpperThreshold').prop('disabled', true);
}
}
// reset combo
$('#InactiveThresholds').combobox('setValue', combo.id);
$('#InactiveThresholds').combobox('setText', function () {
if (isNaN(combo.text)) {
return combo.text;
} else {
return formatNumber(combo.text, '###,###,###');
}
});
// Clear any rules
$('#ThresholdRule').text('');
if (combo.id != "*") {
// Show Detail
$('#ThresholdLevelDetail').slideDown();
} else {
$('#ThresholdLevelDetail').slideUp();
}
}
});
$('#ThresholdLevelDetail').hide();
$('#SelectInactiveThresholds').show();
$('#UpperThreshold').prop('disabled', false);
$('#ThresholdCurrency_Txt').text($('#ThresholdCCY_Txt').text());
$('#dlgThresholdDetail').dialog('open').dialog('setTitle', 'New Threshold').dialog('center');
}
I really need a simple solution here because this design pattern is used all over the place. (And yes this is the same 1.3.x to 1.8.x conversion rearing it's ugly head.)