Dojo - dijit / ComboBox - 鼠标选择不起作用

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Dojo - dijit / ComboBox - 鼠标选择不起作用相关的知识,希望对你有一定的参考价值。

不确定这是ComboBox的错误还是我的实现错误。我正在使用数组中的值填充ComboBox。 ComboBox似乎主要工作 - 所有值都在那里,默认值正在设置,建议即将到来。唯一的问题是我无法通过鼠标单击选择任何下拉选项。我只能使用箭头按钮+ Enter来选择选项。这是设计还是错误?

这是我的html的摘录,用于模板化小部件:

<td style="width:25%;"><input data-dojo-attach-point="testReports" data-dojo-type="dijit/form/ComboBox"></input></td>

这是我的javascript代码。我填充ComboBox,然后将其放入HTML模板:

var reportStore = new Memory();
for(i = 0; i < this.parent.reportNames.length; i++){
    var reportObject = {};
    reportObject.id = i;
    reportObject.name = this.parent.reportNames[i];
    reportStore.put(reportObject);
}
this.testReports.set("id", "reportsDropDown");
this.testReports.set("name", "reports");
this.testReports.set("value", this.parent.reportNames[0]);
this.testReports.set("store", reportStore);
this.testReports.set("searchAttr", "name");

还有什么我应该考虑让鼠标选择工作吗?

谢谢!

答案

您是否尝试将onchange事件添加到输入标记中?这应该选择并选择使用鼠标进行的列表更改。

<input data-dojo-attach-point="testReports" data-dojo-type="dijit/form/ComboBox" onchange="processComboChange(this)"></input>
另一答案

我尝试以不同的方式定义插件,它现在似乎正在工作:

HTML:

<td style="width:25%;"><input data-dojo-attach-point="testReports"></td>

JavaScript的:

var reportStore = new Memory();

for(i = 0; i < this.parent.reportNames.length; i++){
    var reportObject = {};
    reportObject.id = i;
    reportObject.name = this.parent.reportNames[i];
    reportStore.put(reportObject);
}

var comboBox= new ComboBox({
    id: "reportsDropDown",
    name: "reports",
    value: this.parent.reportNames[0],
    store: reportStore,
    searchAttr: "name"
}, this.testReports).startup();

我在想,我尝试的另一种方式是搞乱需要加载的顺序。不确定是否有其他人可以更好地解释它?

另一答案

我不知道究竟是什么导致了你的问题,但看起来是因为你混合了创建widget的编程和声明方法。 Dojo对这些事情非常敏感,你可以花上几个小时,试图弄清楚为什么你的广告不起作用......我想提一下你的代码。如果以声明方式创建窗口小部件,则可以内联传递必要的属性,而无需在js中设置它们。因此,您可以通过以下方式制作它,而不是this.testReports.set("id", "reportsDropDown");

  <input data-dojo-attach-point="testReports" 
        data-dojo-type="dijit/form/ComboBox"
        data-dojo-props="store: store, searchAttr: name">
  </input>

或者如果您更喜欢程序化创建:

模板

<input id="test-reports"></input>  

JS

var testReports = new ComboBox({
        id: "testReports",
        name: "reports",
        value: "",
        store: store,
        searchAttr: "name"
    }, "test-reports").startup();      

在第二种情况下,您不必为元素定义data-dojo-attach-point属性,并使用元素ID而不是引用this.someNode

以上是关于Dojo - dijit / ComboBox - 鼠标选择不起作用的主要内容,如果未能解决你的问题,请参考以下文章

Dojo:dojo onblur 事件

Dojo - Dijit.Tree - 更新树

如何使用 Dojo 提交带有 dijit.form.Form 的帖子数据?

最佳实践 - 将 dojo/dijit 升级到 dojo2 应用程序

Dojo/Dijit - 如何在布局控件上允许垂直滚动

在 Dojo/Dijit 中动态加载 CSS?