2013-11-12 4 views
0

Я привязал атрибут value dojox.mobile.Switch к свойству в модели с использованием dojox.mvc.at. когда я изменил свойство в модели, коммутатор реагирует на изменения; но когда я изменил состояние переключателя, свойство в модели не будет обновляться.dojox mobile datepicker и переключатель не работают с использованием dojox mvc

То же самое касается и dojox.mobile.DatePicker.

Я использую додзё 1.9.0

Может ли один помочь с этим вопросом?

<div class="row"> 
    <label for="switch"></label> 
    <div id="switch" data-dojo-type="dojox.mobile.Switch" data-dojo-props="leftLabel: 'ON',rightLabel: 'OFF', value: at(appContent,'switch')" onStateChanged="alert(this.value)"></div> 
</div> 

и мой объект mdoel является

require(["dojox/mvc/getStateful", 
     "dojox/mobile/TextBox", 
     "dojox/mobile/ValuePickerDatePicker", 
     "dojox/mobile/DatePicker", 
     "dojox/mobile/Opener", 
     "dojox/mobile/TabBarButton", 
     "dojox/mobile/RadioButton", 
     "dojox/mobile/TextArea", 
     "dojox/mobile/Slider", 
     "dojox/mvc/Output", 
     "dojox/mobile/Switch"], 
     function(getStateful){ 
      var data={ 
        'switch':'on' 
      }; 
      appContent=getStateful(data); 
}); 

ответ

0

Эти виджеты имеют отдельные вопросы. Путь dojox/mobile/Switch класс составлен с dojo/_base/declare не работает с тем, как dojox/mvc расширяет dijit/_WidgetBase, который является базовым классом большинства виджетов. Вам нужно будет применить расширение явно dojox/mobile/Switch работать вокруг этого вопроса, как:

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/mobile/deviceTheme.js" data-dojo-config="mblThemeFiles: ['base']"></script> 
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js" data-dojo-config="async: 1, parseOnLoad: 0"></script> 
     <script type="text/javascript"> 
      require([ 
       "dojox/mvc/atBindingExtension", 
       "dojox/mobile/Switch" 
      ], function(atBindingExtension, Switch){ 
       atBindingExtension(Switch.prototype); 
       require([ 
        "dojo/Stateful", 
        "dojox/mvc/at", 
        "dojox/mobile/parser", 
        "dojox/mvc/Output" 
       ], function(Stateful, at, parser){ 
        window.at = at; 
        window.model = new Stateful({ 
         state: "off" 
        }); 
        parser.parse(); 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <div data-dojo-type="dojox/mobile/Switch" data-dojo-props="value: at(model, 'state')"></div> 
     <div>Switch state: <span data-dojo-type="dojox/mvc/Output" data-dojo-props="value: at(model, 'state')"></span></div> 
    </body> 
</html> 

dojox/mobile/DatePicker не отправляет ввод пользователя обратно в атрибуте value. Вам нужно будет следить за изменение каждого слота и обновить value атрибут вручную, чтобы обойти, что:

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/mobile/deviceTheme.js" data-dojo-config="mblThemeFiles: ['base', 'DatePicker']"></script> 
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js" data-dojo-config="async: 1, parseOnLoad: 0"></script> 
     <script type="text/javascript"> 
      require([ 
       "dojo/_base/array", 
       "dojo/aspect", 
       "dojo/date/locale", 
       "dojo/date/stamp", 
       "dojo/Stateful", 
       "dojox/mvc/at", 
       "dojox/mobile/parser", 
       "dojox/mobile/DatePicker", 
       "dojox/mvc/Output" 
      ], function(array, aspect, locale, stamp, Stateful, at, parser, DatePicker){ 
       window.at = at; 
       window.model = new Stateful({ 
        date: stamp.toISOString(new Date()) 
       }); 
       aspect.after(DatePicker.prototype, "startup", function(){ 
        var self = this, 
         slots = this.slots; 
        array.forEach(slots, function(slot){ 
         self.own(slot.watch("value", function(){ 
          var pattern = slots[0].pattern + "/" + slots[1].pattern + "/" + slots[2].pattern; 
          self._set("value", stamp.toISOString(locale.parse(slots[0].get("value") + "/" + slots[1].get("value") + "/" + slots[2].get("value"), {datePattern: pattern, selector: "date"}))); 
         })); 
        }); 
       }); 
       parser.parse(); 
      }); 
     </script> 
    </head> 
    <body> 
     <div data-dojo-type="dojox/mobile/DatePicker" data-dojo-props="value: at(model, 'date')"></div> 
     <div>Date picker value: <span data-dojo-type="dojox/mvc/Output" data-dojo-props="value: at(model, 'date')"></span></div> 
    </body> 
</html> 

Надеется, что это помогает.

Бест, - Акира

0

я попытался с изменениями, которые вы упомянули для dojox.mobile.Switch, но он не работает. Он по-прежнему привязан к одному (от модели к виду) и не относится к модели. Я прошел через файл Switch.js и обнаружил, что способ обновления атрибута «значение» - это не то, как запускается mvc. Я вручную добавил три строки кода в dojox/mobile/Switch.js, две строки в функции _onClick и одну строку в _changeState, а коммутатор работает отлично с mvc и без mvc. Являются ли эти изменения действительными?

_changeState: function(/*String*/state, /*Boolean*/anim){ 

this._set ("значение", состояние); */Добавил меня */

 var on = (state === "on"); 
     this.left.style.display = ""; 
     this.right.style.display = ""; 
     this.inner.style.left = ""; 
     if(anim){ 
      domClass.add(this.switchNode, "mblSwitchAnimation"); 
     } 
     domClass.remove(this.switchNode, on ? "mblSwitchOff" : "mblSwitchOn"); 
     domClass.add(this.switchNode, on ? "mblSwitchOn" : "mblSwitchOff"); 
     domAttr.set(this.switchNode, "aria-checked", on ? "true" : "false"); //a11y 

     var _this = this; 
     _this.defer(function(){ 
      _this.left.style.display = on ? "" : "none"; 
      _this.right.style.display = !on ? "" : "none"; 
      domClass.remove(_this.switchNode, "mblSwitchAnimation"); 
     }, anim ? 300 : 0); 
    } 


_onClick: function(e){ 
     // summary: 
     //  Internal handler for click events. 
     // tags: 
     //  private 
     if(e && e.type === "keydown" && e.keyCode !== 13){ return; } 
     if(this.onClick(e) === false){ return; } // user's click action 
     if(this._moved){ return; } 
    // this.value= this.input.value= (this.value == "on") ? "off" : "on"; removed by me 
     this.input.value = (this.value == "on") ? "off" : "on"; //added by me 
     this._set('value', this.input.value);     //added by me 
     console.log("clicked and this.value "+this.value); 
     this._changeState(this.value, true); 
     this.onStateChanged(this.value); 
    } 

я проверил дважды, и нет никакой проблемы с нормальным поведением, а также прекрасно работает с MVC. если эти изменения действительны, сделайте эти изменения в следующей версии для поддержки mvc.

+0

Понятно, что это имеет смысл, хотя я не являюсь владельцем dojox/mobile. Вы можете ввести билет на bugs.dojotoolkit.org. – asudoh