113 lines
4 KiB
HTML
113 lines
4 KiB
HTML
|
<html>
|
||
|
<head>
|
||
|
<title>testing widgetsInTemplate support</title>
|
||
|
<script type="text/javascript" src="../../dojo/dojo.js"
|
||
|
djConfig="parseOnLoad: true, isDebug: true"></script>
|
||
|
<script type="text/javascript">
|
||
|
dojo.require("doh.runner");
|
||
|
|
||
|
dojo.require("dijit.form.Button");
|
||
|
dojo.require("dijit.form.CheckBox");
|
||
|
dojo.require("dijit.ProgressBar");
|
||
|
|
||
|
dojo.addOnLoad(function(){
|
||
|
var testW;
|
||
|
doh.register("t",
|
||
|
[
|
||
|
{
|
||
|
name: "dojoAttachPoint",
|
||
|
runTest: function(t){
|
||
|
var testW = dijit.byId("test1Widget");
|
||
|
t.t(testW.normalNode);
|
||
|
t.f(isNaN(testW.normalNode.nodeType));
|
||
|
t.t(testW.buttonWidget instanceof dijit.form.Button);
|
||
|
t.t(testW.checkboxWidget instanceof dijit.form.CheckBox);
|
||
|
t.t(testW.progressBarWidget instanceof dijit.ProgressBar);
|
||
|
// alert((testW.buttonWidget instanceof dijit.form.Button)+(testW.checkboxWidget instanceof dijit.form.CheckBox)+(testW.progressBarWidget instanceof dijit.ProgressBar)+
|
||
|
// (testW.buttonWidget._counter==1)+(testW.checkboxWidget._counter==1)+(testW.progressBarWidget._counter==1));
|
||
|
testW = dijit.byId("test2Widget");
|
||
|
t.t(testW.containerNode);
|
||
|
t.f(isNaN(testW.containerNode.nodeType));
|
||
|
t.is(undefined,testW.buttonWidget);
|
||
|
t.t(testW.checkboxWidget instanceof dijit.form.CheckBox);
|
||
|
}
|
||
|
},
|
||
|
{
|
||
|
name: "dojoAttachEvent",
|
||
|
runTest: function(t){
|
||
|
var testW = dijit.byId("test1Widget");
|
||
|
testW.buttonWidget._counter=0;
|
||
|
testW.buttonWidget.onClick(testW.buttonWidget);
|
||
|
testW.checkboxWidget._counter=0;
|
||
|
testW.checkboxWidget.onClick(testW.checkboxWidget);
|
||
|
testW.progressBarWidget._counter=0;
|
||
|
testW.progressBarWidget.onChange(testW.progressBarWidget);
|
||
|
t.is(1,testW.buttonWidget._counter);
|
||
|
t.is(1,testW.checkboxWidget._counter);
|
||
|
t.is(1,testW.progressBarWidget._counter);
|
||
|
}
|
||
|
}
|
||
|
]
|
||
|
);
|
||
|
doh.run();
|
||
|
});
|
||
|
</script>
|
||
|
<style type="text/css">
|
||
|
@import "../themes/tundra/tundra.css";
|
||
|
</style>
|
||
|
</head>
|
||
|
<body>
|
||
|
<h1>testing widgetsInTemplate support</h1>
|
||
|
<xmp id="Test1Template" style="display:none;">
|
||
|
<div>
|
||
|
<div dojoAttachPoint="normalNode" >normal node</div>
|
||
|
<button dojoAttachPoint="buttonWidget" dojoAttachEvent="onClick:onClick" dojoType="dijit.form.Button">button #1</button>
|
||
|
<div dojoAttachPoint="checkboxWidget" dojoAttachEvent="onClick:onClick" dojoType="dijit.form.CheckBox"></div> checkbox #1
|
||
|
<div dojoAttachPoint="progressBarWidget" dojoAttachEvent="onChange:onClick" style="width:400px" annotate="true"
|
||
|
maximum="200" progress="20" dojoType="dijit.ProgressBar"></div>
|
||
|
</div>
|
||
|
</xmp>
|
||
|
<script>
|
||
|
dojo.declare('Test1Widget',
|
||
|
[dijit._Widget, dijit._Templated],
|
||
|
{
|
||
|
widgetsInTemplate: true,
|
||
|
// isContainer: true,
|
||
|
|
||
|
templateString: dojo.byId('Test1Template').textContent || dojo.byId('Test1Template').innerText,
|
||
|
onClick: function(e){
|
||
|
if(e.target){
|
||
|
alert('onClick widgetId='+e.target.id);
|
||
|
}else{
|
||
|
if(e._counter == undefined){
|
||
|
e._counter = 1;
|
||
|
}else{
|
||
|
e._counter++;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
</script>
|
||
|
<!-- can use widget immediately in markup - no parsing occurs until document loaded and scripts run -->
|
||
|
<div dojoType="Test1Widget" id="test1Widget" ></div>
|
||
|
|
||
|
|
||
|
<xmp id="Test2Template" style="display:none;">
|
||
|
<div>
|
||
|
<div dojoAttachPoint="containerNode" ><div dojoAttachPoint="checkboxWidget" dojoType="dijit.form.CheckBox"></div> checkbox #2</div>
|
||
|
</div>
|
||
|
</xmp>
|
||
|
<script>
|
||
|
dojo.declare('Test2Widget',
|
||
|
[dijit._Widget, dijit._Templated],
|
||
|
{
|
||
|
widgetsInTemplate: true,
|
||
|
|
||
|
templateString: dojo.byId('Test2Template').textContent || dojo.byId('Test2Template').innerText
|
||
|
});
|
||
|
</script>
|
||
|
<div dojoType="Test2Widget" id="test2Widget" ><button dojoAttachPoint="buttonWidget" dojoType="dijit.form.Button">button #2</button></div>
|
||
|
</body>
|
||
|
</html>
|
||
|
|