与模板

3

可以使用dojo.declare扩展它。然后您可以覆盖templateString。

dojo.declare('PropertySheetDialog', [dijit.Dialog], { 
    //this is the default template for dijit.Dialog 
    templateString: dojo.cache("dijit", "templates/Dialog.html"), 
});

上面提到的默认模板是道场/ dijit的/模板/ Dialog.html 您可以与启动。

来源

2011-09-21 07:45:52

1

图片在你的问题是相当有趣的...... 我延长Dijit.Dialog这样的：

对话与TemplatedMixin和WidgetsInTemplateMixin混合，可以插入任何声明部件。

define([ 
    "dojo/_base/declare", 
    "dijit/Dialog", 
    "dijit/_TemplatedMixin", 
    "dijit/_WidgetsInTemplateMixin", 
    "dojo/text!./templates/custom.html", 
    "dojox/form/CheckedMultiSelect" 
], function (declare, Dialog, TemplatedMixin, _WidgetsInTemplateMixin, template) { 
    return declare("app.management.panels.customColumn", [Dialog, TemplatedMixin, _WidgetsInTemplateMixin], { 
     templateString:template, 

     } 
    }); 
});

./templates/custom.html是原始模板的副本。把你的代码放在containerNode。

<div class="dijitDialog" role="dialog" aria-labelledby="${id}_title"> 
    <div data-dojo-attach-point="titleBar" class="dijitDialogTitleBar"> 
     <span data-dojo-attach-point="titleNode" class="dijitDialogTitle" id="${id}_title" 
       role="header" level="1"></span> 
     <span style="display: none;" data-dojo-attach-point="closeButtonNode" class="dijitDialogCloseIcon" 
       data-dojo-attach-event="ondijitclick: onCancel" title="${buttonCancel}" role="button" tabIndex="-1"> 
      <span data-dojo-attach-point="closeText" class="closeText" title="${buttonCancel}">x</span> 
     </span> 
    </div> 
    <div data-dojo-attach-point="containerNode" class="dijitDialogPaneContent"> 
     <select multiple="true" name="multiselect" data-dojo-type="dojox.form.CheckedMultiSelect"> 
      <option value="VA" selected="selected">Virginia</option> 
      <option value="WA" selected="selected">Washington</option> 
      <option value="FL">Florida</option> 
      <option value="CA">California</option> 
     </select> 
    </div> 
</div>

更新

另一种方式来做到这一点，只有在道场1.8测试。您可以使用“的dijit /进度”中./templates/progressInfo.html

define([ 
    "dojo/_base/declare", 
    "dojo/_base/lang", 
    "dojox/widget/Standby", 
    "dijit/TitlePane", 
    "dijit/_WidgetsInTemplateMixin", 
    "dojo/text!./templates/progressInfo.html", 
    "dijit/ProgressBar" 
], function (declare, lang, Standby, TitlePane, _WidgetsInTemplateMixin, template) { 
    return declare("app.management.panel.cpanel.progressInfo", [TitlePane, _WidgetsInTemplateMixin], { 
     'class':'cpanelProgressInfo', 
     title:"progressInfo", 
     toggleable:false, 
     style:"width:450px;", 
     mainStore:null, 
     content:template, 
     postCreate:function() { 
      this.inherited(arguments); 
      this.Standby = new Standby({target:this.domNode, zIndex:1000, color:"#eeeeee"}); 
      this.addChild(this.Standby); 
      this.Standby.show(); 
     }, 
     refresh:function() { 
      // my custom dojo store 
      var rt = this.mainStore.query()[0]; 
      this.set('content', lang.replace(template, rt)); 
     } 
    }); 
});

来源

2012-10-19 07:48:23 HackieChain

+0

这工作很漂亮，但也不是很面向未来。如果将来更改对话框的代码/模板，您的对话框将会中断。 – voidstate

+0

@voidstate我找到了一个新的方法。查看更新。 – HackieChain

+1

工作，但我如何传播扩展点从模板到我的班？例如如果你在progressInfo.html中有一个data-dojo-attach-point，那么你的progressInfo类中就没有这个。有什么会“注入”吗？谢谢 – belzebu

0

您可以创建在构造匿名插件和模板加载到。

但是，这可能会导致布局小部件的问题，你不能在模板中使用的数据Dojo的附加事件（而不是线了按钮，手动等）。

define([ 'dojo/_base/declare', 
      'dijit/Dialog', 

     // used for anonymous content widget 
     'dijit/_WidgetBase', 
     'dijit/_TemplatedMixin', 
     'dijit/_WidgetsInTemplateMixin', 
     'dojo/text!/js/myProject/CustomDialog/templates/CustomDialog.html', 

     // for wiring up buttons 
     'dojo/_base/lang', 
     'dojo/on', 

     // used in anonymous widget's template 
     'dijit/form/ValidationTextBox', 
     'dijit/form/NumberSpinner', 
     'dijit/form/Textarea', 
     'dijit/form/Button' ], 
    function(declare, Dialog, _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, template, lang, on)  
    { 
     return declare([ Dialog ], // inherit from dijit/Dialog 
     { 
      id: 'my_custom_dialog', 
      title: 'I Am Custom!', 

      declaredClass: 'myProject.CustomDialog', 

      constructor: function(myProjectsettings) 
      { 
       var contentWidget = new (declare([ _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin ], 
       { 
        templateString: template 
       })); 
       contentWidget.startup(); 
       this.content = contentWidget; 
      }, 

      postCreate: function() 
      { 
       // run any parent postCreate processes 
       this.inherited(arguments); 

       // automatically wire up the cancel button 
       on.once(this.content.cancelButton, 'click', lang.hitch(this,  
       function() 
       { 
        this.onCancel(); // use same method as X button 
       })); 
      } 
     }); // end declare 
    } 
);

来源

2012-11-23 09:03:18 voidstate

0

本身的buildRendering改变templateString，因此你从两个模板的所有_widget东西。欲了解更多详情，请参阅答案在here

来源

2013-06-25 13:14:47 belzebu

0

使用内部类是简单的，将被道场全力支持。

define("sample/dialog/CreateUserDialog", [ 
    "dojo/_base/declare", 
    "dijit/Dialog", 
    "dojo/text!./resources/CreateUserDialog.html", 
    "dijit/layout/ContentPane", 
    "dijit/_TemplatedMixin", 
    "dijit/_WidgetsInTemplateMixin" 
], function(declare, Dialog, template, ContentPane, TemplatedMixin, WidgetsInTemplateMixin) { 
    declare("sample.layout._CreateUserPane", [ContentPane, TemplatedMixin, WidgetsInTemplateMixin],{ 
    templateString: template 
    }); 

    return declare("sample.dialog.CreateUserDialog", [Dialog],{ 
    title: "Create User", 
    content: new sample.layout._CreateUserPane() 
    }); 
});

您可以通过“（对话框实例）.content”来触摸内容对象。

来源

2013-10-06 06:35:37

回答

相关问题