EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: 2plus2 on September 30, 2019, 07:53:29 PM



Title: Combobox: setValue within an onSelect
Post by: 2plus2 on September 30, 2019, 07:53:29 PM
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:

Code:
	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.)


Title: Re: Combobox: setValue within an onSelect
Post by: jarry on October 04, 2019, 03:20:02 AM
If you want to get the selected row from the 'onChange' event handler, please try this.
Code:
$('#cb').combobox({
onChange: function(value){
var data = $(this).combobox('getData');
var rows = data.filter(function(r){
return r.value == value;
})
var row = rows[0]
console.log(row)
}
})