2

我有一个dijit.form.Select用于将标签映射到值的小部件。一些标签需要具有相同的值,但我需要能够在进行选择时区分标签。现在小部件的选项看起来像这样:

[
    {
        label: "A",
        value: "1",
    },
    {
        label: "B",
        value: "2"
    },
    {
        label: "C",
        value: "2"
    }
],

That is done because the form's processing needs to know that 'B' and 'C' both actually mean 2, but I need to perform some different logic on another control when 'B' vs 'C' is selected. 我发现我可以get("displayedValue")onChange事件处理程序中获取“显示”标签,但它总是会返回与当前值 (2) 匹配的第一个选项 (B),这不一定是用户选择的

那么,当多个标签需要评估为相同的值同时仍然能够区分标签时,我该如何处理呢?

4

1 回答 1

0

只需使用 dijit/form/Select 小部件focusNode.textcontent属性:

function disaplySelected() {
  document.getElementById("labelContainer").innerHTML = window.sel.focusNode.textContent;
  document.getElementById("valueContainer").innerHTML = window.sel.value;
}

require(["dijit/form/Select", "dojo/_base/window", "dojo/domReady!"], function(Select, win) {
  window.sel = new Select({
    name: "select2",
    options: [
      {label: "A",value: "1"},
      {label: "B",value: "2"},
      {label: "C",value: "2"}
    ],
  });
  window.sel.placeAt(win.body(), "first").startup();
});
<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.10.1/dojo/dojo.js" data-dojo-config="async: true"></script>
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.10.1/dijit/themes/claro/claro.css">
</head>

<body class="claro">
  <p>
    <button onclick="disaplySelected()">Display selected label</button>
    <br/>Selected item label: <span id="labelContainer"></span>
    <br/>Selected item value: <span id="valueContainer"></span>
  </p>
</body>
</html>

于 2014-11-11T21:50:09.760 回答