2014-10-08 2 views
0

Я пытаюсь создать привязанный к данным собственный список выбора с dojo, я не хочу видеть виджетов dojo, просто выберите, однако, я изо всех сил пытаюсь его получить рабочийDojo и привязка native select с WidgetList

Следующий код «работает» (он связывает три элемента в массиве), обратите внимание, что я обернул параметры в тегах span, что, конечно же, сделает выделение пустым. Если я удалю опцию span, то она не работает.

Любая идея, как я могу достичь этого, может быть, совсем другой подход?

Код:

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script src="/Scripts/dojo-release-1.9.3/dojo/dojo.js" data-dojo-config="parseOnLoad: 0, async: 1"></script> 
    <script type="text/javascript"> 
     require([ 
      "dojo/parser", 
      "dojo/Stateful", 
      "dojox/mvc/StatefulArray", 
      "dojox/mvc/Output", 
      "dojo/domReady!" 
     ], function (parser, Stateful, StatefulArray) { 
      model = new StatefulArray([{ 
        Name: "Lars", 
        Value: 0 
        }, { 
        Name: "Per", 
        Value: 1 
        }, { 
        Name: "Ola", 
        Value: 2 
        }]); 

      setValue = function (value) { 
       alert("running"); 
       this._set("innerText", value); 
      };  
      parser.parse();  
     }); 
    </script> 
</head> 
<body> 
<script type="dojo/require">at: "dojox/mvc/at"</script>   
<select data-dojo-type="dojox/mvc/WidgetList" 
     data-dojo-mixins="dojox/mvc/_InlineTemplateMixin" 
     data-dojo-props="children: model">     
    <script type="dojox/mvc/InlineTemplate"> 
     <span> 
      <option data-dojo-type="dojox/mvc/Output" data-dojo-props="value: at(this.target, 'Name'), _setValueAttr: setValue"></option> 
     </span> 
    </script> 
</select> 
</body> 
</html> 

ответ

1

есть две уловки:

  • Вы не можете в основном указать /data-dojo-props в корневом узле шаблона. Чтобы облегчить такое ограничение, dojox/mvc/WidgetList имеет data-mvc-child-type/data-mvc-child-props.
  • dojox/mvc/Output полезен, но вы можете добиться подобной вещи с помощью функции «привязки узлов» dijit/_WidgetBase.

Приводится пример <select>/<option> вещь. Надеюсь это поможет.

Бест, - Акира

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.1/dojo/dojo.js" data-dojo-config="parseOnLoad: 0, async: 1"></script> 
     <script type="text/javascript"> 
      require([ 
       "dojo/parser", 
       "dojo/Stateful", 
       "dojox/mvc/StatefulArray", 
       "dojo/domReady!" 
      ], function (parser, Stateful, StatefulArray) { 
       model = new StatefulArray([ 
        {name: "Foo"}, 
        {name: "Bar"}, 
        {name: "Baz"} 
       ]); 

       parser.parse();  
      }); 
     </script> 
    </head> 
    <body> 
     <script type="dojo/require">at: "dojox/mvc/at"</script>   
     <select data-dojo-type="dojox/mvc/WidgetList" 
       data-dojo-mixins="dojox/mvc/_InlineTemplateMixin" 
       data-dojo-props="children: model" 
       data-mvc-child-props="_setTextAttr: {node: 'domNode', type: 'innerText'}, text: at(this.target, 'name')">     
      <script type="dojox/mvc/InlineTemplate"> 
       <option></option> 
      </script> 
     </select> 
    </body> 
</html> 
+0

ааа, спасибо, вы сделали мой день! :) –

+0

При попытке этого в моем виджете это не работает одинаково. Я пытаюсь связать с data-dojo-props = "children: this.layersStore" - инициализировать statefularray в функции конструктора; this.layersStore = new StatefulArray ({... selectlist is empty. Я не думаю, что привязка понимает this.layersStore. Или это потому, что это шаблон в шаблоне и что шаблон уже разобран? Советы? –

+0

Dojo принимает подход «объект-держатель-объект» для наблюдения за изменением ценности, и для этого требуется ['dojo/Stateful # set()'] (http://dojotoolkit.org/reference-guide/1.10/dojo/Stateful.html#set) API для уведомления изменений наблюдателям. Простое присваивание значения свойства не будет работать. Поэтому вы можете попробовать 'this.set (" layersStore ", ...)' – asudoh

Смежные вопросы