Javascript 在dojo中将数据从一个选项卡绑定到另一个选项卡(打开选项卡?)
我一直在使用Dojo1.7,有两个选项卡。我在一个选项卡的一个字段中设置了一个值,该值需要进入另一个选项卡的另一个字段。 我似乎记得,在1.7+中打开选项卡时,有一种方法可以执行javascript例程,但就我的一生而言,我找不到执行此操作的参数。 我计划执行javascript,通过dojo.byId读取值,然后在另一个选项卡中填充值。除非有人知道将一个选项卡中的值绑定到另一个选项卡中的另一个字段的更简单方法。那太好了Javascript 在dojo中将数据从一个选项卡绑定到另一个选项卡(打开选项卡?),javascript,dojo,Javascript,Dojo,我一直在使用Dojo1.7,有两个选项卡。我在一个选项卡的一个字段中设置了一个值,该值需要进入另一个选项卡的另一个字段。 我似乎记得,在1.7+中打开选项卡时,有一种方法可以执行javascript例程,但就我的一生而言,我找不到执行此操作的参数。 我计划执行javascript,通过dojo.byId读取值,然后在另一个选项卡中填充值。除非有人知道将一个选项卡中的值绑定到另一个选项卡中的另一个字段的更简单方法。那太好了 和往常一样,谢谢你的建议。 Janie对于单个临时同步,我建议使用dojo
和往常一样,谢谢你的建议。
Janie对于单个临时同步,我建议使用
dojo/Stateful
的watch
方法,这是每个dijit小部件(更准确地说是每个子类dijit/_WidgetBase
的混入。它允许监视更改的值,而不是挂起函数调用上的事件
var spinner1 = registry.byId("spinner1")
, spinner2 = registry.byId("spinner2")
;
spinner1.watch("value", function(prop, oldValue, newValue) {
spinner2.set("value", newValue);
});
在JSFIDLE上查看它的实际操作:
有关更复杂的案例,请参阅我的答案,并查看一个工作示例:
编辑:原始问题的答案是选项卡的ContentPane
方法上的dojo/aspect
:
aspect.after(registry.byId("tab2"), "_onShow", function() {
console.log("#tab2 is now visible");
});
我将此添加到前面提到的内容中。为了完整起见,您可以像这样轻松地使用phusick的答案:
require(
["dojo/_base/declare", "dijit/form/NumberSpinner"],
function (declare, Spinner )
{
declare("my.spinner", [dijit.form.NumberSpinner], {
linkedInputs: [],
startup: function() {
var self = this;
if(this.linkedInputs) {
self.watch("value", dojo.hitch(self, self.setOther));
}
return this.inherited(arguments);
},
setOther: function() {
var links = this.linkedInputs, newVal= self.get("value")
dojo.ready(function() {
dojo.forEach(links, function(input) {
/*assert if string*/ dijit.byId(input).set("value", newVal);
});
});
}
});
});
注意,如果需要一个双向的“linkedInput”,则需要在watch函数中创建一个互斥锁。否则,一个输入设置另一个输入。观察另一个设置一个,同时观察一个输入中的值再次设置另一个,以此类推 出色地使用有状态的
。在那个些日子之前,人们会将侦听器附加到spinner.onChange,并使用“inthere”参数调用linkedspinner.set(value)哇!我从来没有得到过如此完美和完整的答案@普西克,你太棒了!JWIMO这不是最优的。从实际的角度来看,您必须在每个要同步的dijit类中创建子类/扩展/混合,从架构的角度来看,没有理由让particalar小部件知道它正在同步。我认为这是某种类型的工作。如果你想要一个控制器视图模式,你也可以在我的锁中找到一个互斥锁。但是,如果您希望文本框具有这种可移植性,那么为什么要混合验证呢?为了便于讨论,上面的内容可以很容易地混合到任何valuewidget中。您只需在my.spinner
中反转观察者模式即可。假设您有tab1
和form1/spinner1
以及tab2
和form2/spinner2
。您希望spinner1
与spinner2
同步,因此将spinner2
引用放在spinner1.linkedInputs
中。但你会怎么做呢form2
尚不存在,因为您将在它可见时加载/实例化它。您可以将spinner2
添加到spinner1中。当spinner2
实例化时,LinkedInput
,[…][…]但是要这样做,您需要引用spinner1
,但它可能还不存在。因此,您将在spinner1
中得到一个条件,以添加spinner2
(如果存在),并在spinner2
中得到一个条件,以将自身添加到spinner1
(如果存在)。现在添加form3/spinner3
并同步它。和form4/喷丝头4
。你在多少地方有多少条件?现在只需注释一行就可以删除form1/spinner1
。如果您有两个独立的模块(在本例中为表单或选项卡),并且module1需要引用module2,module2需要引用module1,那么您知道您做错了什么。我非常喜欢NetBeans平台,在这个平台上,您必须明确指定模块之间的依赖关系。我不能在JS中强制这样做,但至少我可以尝试根据这些原则设计我的应用程序。如有兴趣,请参阅-第1部分:模块系统API。