如何关闭包含带有onchange事件的过滤选择的dijit TooptipDialog?

时间:2014-03-09 02:32:12

标签: dojo

我正在尝试单独弹出或使用TooltipDialog显示FilteringSelect,然后在进行选择时关闭。代码看起来很像这样:

<html>
<head>
    <link rel="stylesheet" href="./style.css" media="screen">
    <link rel="stylesheet" href="../dijit/themes/claro/claro.css" media="screen">
    <!-- load dojo and provide config via data attribute -->
    <script src="../dojo/dojo.js" data-dojo-config="async: true,parseOnLoad: true" charset="utf-8">
    </script>
</head>
<body class="claro">
<div id="dropDownButtonContainer"></div>
<div id="result1"></div>
<button id='showstate' type="button"    
 onclick='document.getElementById("result2").innerHTML=stateSelect.value;'>button1</button>
<div id="result2"></div>
<script>
var filteringSelect = null;
require([
    "dojo/ready", "dojo/store/Memory", "dijit/form/FilteringSelect"],
     function (ready, Memory, FilteringSelect) {
    var stateStore = new Memory({
        data: [{ name: "Alabama",id: "AL"},
        {name: "Alaska",id: "AK"}]
    });
    filteringSelect = new FilteringSelect({
        id: "stateSelect",
        name: "state",
        value: "CA",
        store: stateStore,
        searchAttr: "name",
        onChange: function (stateSelect) {
            // This does not cause the TooltipDialog to close.
            document.getElementById("idxxx33").submit();
        }
    }, "stateSelect");
});
require(["dojo/ready", "dijit/TooltipDialog", "dijit/form/DropDownButton", "dojo/dom"],
 function (ready, TooltipDialog, DropDownButton, dom) {
    ready(function () {
        var myDialog = new TooltipDialog({
            id: "idxxx33"
        });
        myDialog.addChild(filteringSelect);
        var myButton = new DropDownButton({
            label: "show tooltip dialog",
            dropDown: myDialog
        });
        dom.byId("dropDownButtonContainer").appendChild(myButton.domNode);
    });
});
</script>
</body>
</html>

这适用于Dojo 1.8.4。更好的是能够自己弹出FilteringSelect,然后用onChange事件关闭弹出窗口。任何建议表示赞赏!

1 个答案:

答案 0 :(得分:0)

如果您只是想隐藏TooltipDialog,可以在filteringSelect中修改onChange函数

document.getElementById("idxxx33").style.visibility ='hidden'