动态更改 Dojo 多选值

Question

我想向设置了一些值的表单添加一个多选小部件。当用户单击按钮时，多选小部件内的值会发生变化。

当我这样做时，表单崩溃了。

这是问题的示例代码：

 <script type="text/javascript" >
    function test(){

        var msObj = dijit.byId('ms1');
        msObj.set('label', ['val1', 'val2']);

    }
    </script>

</head>
<body class="claro">

<h2>Multiselect Test</h2>
<h3>Click on test button to see new data loaded in the multiselect widget</h3>
    <div data-dojo-type="dijit/form/Form" enctype="multipart/form-data"
        action="" method="POST">
        <div data-dojo-type="dojox/layout/TableContainer"
            data-dojo-props="cols:1">

            <select id="ms1" data-dojo-type="dijit/form/MultiSelect"
                title="MultiSelect123:" name="multi_select">
                <option value="English 123">English 123</option>
                <option value="1234.56">1234.56</option>
            </select> 


        </div>
    <br>
    <button onclick="test()">test</button>

</body>

Answer 1

崩溃的原因是点击按钮时表单被提交。
为了避免提交表单，我们需要在按钮点击功能中设置 return false 值。即

<button onclick="test(); return false;">test</button>

此外，Multiselect Dojo 小部件未与数据关联 store/object。根据文档，它只是 SELECT HTML 元素的包装。
因此，您需要使用基本的 HTML/JS 代码来添加和删除小部件的 OPTIONS。

检查 jsfiddle 以获取工作示例。

动态更改 Dojo 多选值

Dynamically change Dojo multiselect values

javascript

dojo