在Dojo中创建基于模板的iwidget。

时间:2012-08-29 08:32:48

标签: widget rad dojo

我正在学习道场 并尝试在WebShere Application服务器上创建一个iWidget。

我首先尝试创建Helloworld小部件。 已部署。

现在我要添加模板。

我在模板文件夹中创建了一个LoginCmis.html,这个模板用于询问用户名和密码。

CustomerInteraction.js中的

我创建了一个模板字符串。如何在onLoad上添加此内容。

 <div class = LoginCmis>
        <div dojotype="dijit.layout.BorderContainer" id="BorderContainer"
        design="headline" style="height: 250px; width: 400px" align="center">

            <div preload="true" dojotype="dijit.layout.ContentPane" 
                region="top">Login CMIS
            </div>
            <div preload="true" dojotype="dijit.layout.ContentPane" region="centre">

                <table class="form">
                    <tr>
                        <td>UserName</td>
                        <td><input type="text" dojotype="dijit.form.ValidationTextBox"
                            name="username" required="true" maxLength=64 trim="true"
                            style="width: 200px; text-align: left" 
                            dojoattachpoint="username"/>
                        </td>
                    </tr>
                    <tr>
                        <td>Password</td>
                        <td><input type="password" name="password" value=""
                            dojotype="dijit.form.ValidationTextBox" 
                            style="width: 200px; text-align: left"
                            dojoattachpoint="password"/>
                        </td>
                    </tr>
            </table>
        </div>
        </div>
    </div>

在我的CustomerInteraction.xml(这是针对Hello world,我必须在此处进行任何更改)内容

<iw:content mode="view">
        <![CDATA[
              <div id ="helloWorld" > Hello World ! </div>
       ]]>
 </iw:content>

customerInteraction.js

    dojo.provide("helloWorldScope");
    dojo.require("dijit._Widget");
    dojo.require("dijit._Templated");
    dojo.declare("",[ dijit._Widget, dijit._Templated ],{

        templateString : dojo["cache"]("iWidget/widgets/CustomerInteraction", "Template/LoginCmis.html");


        msg1: "Hello World Class Loaded",
        msg2: "Hello World, again",


    onLoad:function() {
            alert(this.msg1);
        }
});

查看此模板需要做些什么改变?

文件夹设计看这个

1 个答案:

答案 0 :(得分:1)

将此mixin _WidgetsInTemplateMixin添加到您的声明中。

小部件没有默认的onLoad函数来调用/绑定。然而,它将作为构建自身的最后阶段,致电startup

确保dojo知道在哪里查找模块并使用类型创建div,以便dojo.parser可以将其重新识别为小部件。

CustomerInteraction.xml:

 <script>
      dojo.registerModulePath("iWidgets", "/iWidget");
      dojo.require("iWidget.widgets.customerInteraction");
 </script>
 <div dojoType="iWidget.widgets.customerInteraction"></div> ... </body>

的WebContent / iWidget中/小部件/ customerInteraction.js

dojo.declare("iWidget.widgets.customerInteraction",[ dijit._Widget, dijit._Templated, dijit._WidgetsInTemplateMixin ],{
     ....
     buildRendering: function() {
          // pre-parser point in flow of construction
          // add you code here
          this.inherited(arguments);
     },
     startup: function() {
          // 'post create' point in flow of construction
          // add you code here
          this.inherited(arguments);
     }
});