以编程方式更改值时触发Dojo Select onChange事件触发

Posted 2021-04-15

我有一个dojo（dijit）select下拉菜单，它调用js函数onChange。我期望它仅在用户更改下拉列表中的值时才调用onChange函数，但是，当我以编程方式从js代码更改下拉列表的值时，它甚至调用onChange函数。我如何才能仅在用户更改下拉值时才调用该函数？以编程方式更改值时，不应调用该函数。

<select jsId="ddlBoundaryType" id="ddlBoundaryType" name="ddlBoundaryType" 
                            dojoType="dijit.form.Select">
                            <option value="0">Circle</option>
                            <option value="1">Polygon</option>
                        </select>

dojo.addOnLoad(InitBoundaries);
    function InitBoundaries() {
        dojo.connect(dijit.byId("ddlBoundaryType"), 'onChange', Boundaries_ChangeBoundaryType); 
    }

答案

我认为在这种情况下，正确的解决方法是http://bugs.dojotoolkit.org/ticket/10594，因为它直接处理dijit.form.Select。当然，有几种方法可以解决此问题。

1. 升级dojo：）。
2. 继承dijit.form.Select并“修补” _updateSelection函数。
3. 扩展dijit.form。选择并直接在此处“修补”。

我将放弃第一个。第二和第三种方法相似，因此我将使用第三种方法发布一个简单的修复程序，

dijit.form.Select.extend({
   _updateSelection: function() {
        this.value = this._getValueFromOpts();
        var val = this.value;
        if(!dojo.isArray(val)){
            val = [val];
        }
        if(val && val[0]){
            dojo.forEach(this._getChildren(), function(child){
                var isSelected = dojo.some(val, function(v){
                    return child.option && (v === child.option.value);
                });
                dojo.toggleClass(child.domNode, this.baseClass + "SelectedOption", isSelected);
                dijit.setWaiState(child.domNode, "selected", isSelected);
            }, this);
        }
   }
});

[请注意，我没有编写此函数，我很高兴从源代码中抄袭它，最后一行删除了this._handleOnChange（this.value）。

myWidget.attr('value', newValue, false) // should now work without firing onChange.

另一答案

通常人们通过使用priorityChange标志来解决此问题：

myWidget.set("value", 1234, false);

这将解决您的问题，除了一些细微的问题，该值最初是123，您可以通过编程将其设置为456，然后用户将其设置回123，在这种情况下，不会发生onChange（）事件。用户操作。

因此，您还可以执行以下操作：

myWidget._lastValueReported=null;

另一答案

一种简单得多的方法是，我建议使用“ _onChangeActive”标志，不建议使用该标志，因为它是出于内部目的。但是，如果需要，我们可以使用它。 “ _onChangeActive”是dojo选择类型窗口小部件中存在的标志，默认情况下设置为true。如果此标志设置为true，则照常触发onChange事件。但是，如果将其设置为false，则当用户或通过编程方式更改值时，不会触发onChange事件。

例如：

var widget = registry.byId('widget_id');
widget.set('_onChangeActive', false); // setting the flag to false
...//make changes to the select programatically
widget.set('_onChangeActive',true); // setting back to true after programatic changes are done

无需为此继承现有的dojo功能或使用单独的外部标志。该小部件为此内置了一个小部件-“ _onChangeActive”。