最近我发现使用选择小部件(CQ.form.Selection)时, selectionchanged 事件会触发两次。当我从下拉列表中选择一些值时,selectchanged会被触发一次,并且在选择完成后从选择窗口小部件中丢失焦点时(→,onblur),会再次触发它。
以下是对话框的结构。
<dialog jcr:primaryType="cq:Dialog" title="Test Component" xtype="panel">
<items jcr:primaryType="cq:WidgetCollection">
<title jcr:primaryType="cq:Widget" fieldLabel="Selection" name="./sel" type="select" xtype="selection">
<listeners jcr:primaryType="nt:unstructured" selectionchanged="function(comp, val, isChecked) {console.log("selected");}"/>
<options jcr:primaryType="cq:WidgetCollection">
<opt1 jcr:primaryType="nt:unstructured" text="Option 1" value="1"/>
<opt2 jcr:primaryType="nt:unstructured" text="Option 2" value="2"/>
<opt3 jcr:primaryType="nt:unstructured" text="Option 3" value="3"/>
</options>
</title>
<link jcr:primaryType="cq:Widget" fieldLabel="Some Text" name="./text" xtype="textfield"/>
</items>
</dialog>
仅当选项类型为选择或组合框而非复选框和广播时才会出现此问题。
我执行错了吗?这种行为是否正常?如何确保只选择一次触发selectionchanged事件?
提前致谢!
P.S:我使用的是CQ 5.5,我不确定最新版本中这种行为是否相同。
答案 0 :(得分:0)
请尝试使用xtype组合并使用更改事件,这样可确保仅触发一次事件。我很确定这会起作用,我在CQ 5.6.1中尝试过。这是文档http://dev.day.com/docs/en/cq/5-5/widgets-api/?class=CQ.Ext.form.ComboBox。
如果你在crx de /libs/cq/ui/widgets/source/widgets/form/Selection.js中查看Selection.js的代码有两个自定义事件fireComboboxSelectionChanged和fireComboboxContentChanged,当选择发生时会触发fireComboboxSelectionChanged更改发生时会触发fireComboboxContentChanged。现在,如果我们看一下extjs文档,那么在模糊发生之前就会触发更改http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.form.ComboBox-event-change,所以理想情况下它看起来在这里有两个独立的事件。但是如果你查看代码,fireComboboxSelectionChanged和fireComboboxContentChanged都会触发一个公共事件this.fireEvent(CQ.form.Selection.EVENT_SELECTION_CHANGED,因此事件会被激发两次我想。再次这只是我最初猜测的代码我会建议你将调试点放在代码中并使用debugClientLibs = true来查明这是否真的是原因。我可能是错的,仍然是CQ的学习者,根据我的推理回答。所以请通过javascript调试自己验证。希望这会有所帮助。