Dojo dijit TabContainer - встроенный выбор с вкладками

Question

Dojo dijit TabContainer - встроенный выбор с вкладками

0

Я занимаюсь графическим интерфейсом с TabContainer (2 вкладки), содержащим два разных набора данных. Мне было проще всего просто создать divs tabcontainer и datagrids декларативно в html, но я мог бы изменить это, если это поможет моей проблеме. Меня спросили, могу ли я установить HTML Select (dijit/form/Select) с вкладками TabContainer. Вот скриншот макета. http://imgur.com/l7nQmx7. Я не уверен, что это возможно, учитывая, как работает TabContainer (будучи div), но задавался вопросом, сделал ли кто-нибудь что-либо подобное. Если да, то как?

Tabcontainer создан следующим образом:

<div data-dojo-type="dijit.layout.TabContainer" style="width:964px; height: 450px;"> 
    <div data-dojo-type="dijit.layout.ContentPane" title="Tasks" data-dojo-props="selected:true">              
        <table id="myDataGrid" dojoType="dojox.grid.DataGrid" style="width:964px; height: 420px; ">
            <thead>
                <tr>
                  <th field="field1" width="10%">one of many fields for datagrid</th>
                </tr>
            </thead>
        </table>
    </div>
    <div data-dojo-type="dijit.layout.ContentPane" title="Workers">
        Placeholder...
    </div>
</div>

Могут быть полезны любые примеры размещения других диджитов с вкладками.

BLWedge09 17 сен. 2013, в 19:39

Источник

Теги:

javascript

html

css

dojo

1 ответ

Ещё вопросы

dori naji · Accepted Answer · 2013-09-17T20-06-00.000Z

Я никогда не пробовал это раньше, но я думаю, что это сработает.

1) <div id='Selectid'></div> в заголовок контейнера табуляции у вас есть <div id='Selectid'></div>

2) используйте программный способ создания выбранной формы:

require(["dijit/form/Select", "dojo/_base/window", "dojo/domReady!"], function(Select, win){
    new Select({
        name: "select2",
        options: [
            { label: "TN", value: "Tennessee" },
            { label: "VA", value: "Virginia", selected: true },
            { label: "WA", value: "Washington" },
            { label: "FL", value: "Florida" },
            { label: "CA", value: "California" }
        ]
    }).placeAt('Selectid');
});

Это должно работать нормально, просто убедитесь, что заголовок вкладки правильно отображает div с идентификатором.