Adding dojo widget inside custom widget

2019-01-25 22:31发布

站内问答 / JavaScript
1596 2 4

I am making a small dojo widget, basically extending the dailog widget and want to add simple widgets like a text input a few labels etc. How do i go about this? I am following a tutorial,

Dojo how to make a widget

Please help me out.

Thanks

2条回答
女痞
2楼-- · 2019-01-25 22:53

If I understood correctly, you are asking about how to include another widgets within your custom widget. If that's the case, then we have to modify OammieR's answer a bit, as it's not complete in regards to your question. To include other widgets within your custom widget, you should include them in your widget declaration:

dojo.provide("gissoft.dijit.widgetOam"); 

dojo.require("dijit.form.Button"); //<- this the standard widget you want to have in your widget
dojo.require("dojo.parser");
dojo.require("dijit._Widget");
dojo.require("dijit._Templated");

dojo.declare("gissoft.dijit.widgetOam", [dijit._Widget, dijit._Templated], {
    widgetsInTemplate: true,
    basePath: dojo.moduleUrl("gissoft.dijit"),
    templatePath: dojo.moduleUrl("gissoft.dijit", "templates/widgetOam.html"),

particularly important is the "widgetsInTemplate: true" part which tells the parser to expect the widgets inside the widget.

Then you just include the HTML markup for the particular widget you'd like to include in your widget's template.

<div> <!-- do not add tag <html> , <head> , <body> but must have <div> first -->
    <button data-dojo-type="dijit.form.Button" type="button" data-dojo-attach-point="_innerWidget" data-dojo-attach-event="ondijitclick:_onClick">Yo!</button>
</div>

dojoAttachPoint is useful so you can get a reference to this widget straightaway in your widget's implementation without getting a reference via dijit.byId('').

Hope this helps.

查看更多
0人赞 添加讨论(0) 举报
SAY GOODBYE
3楼-- · 2019-01-25 23:00

First. I'am not good at english, but will do at my best.

This is the path of my widget.

enter image description here

Here. The important code in the js file that must declare.

dojo.provide("gissoft.dijit.widgetOam"); 

dojo.require("dojo.parser");
dojo.require("dijit._Widget");
dojo.require("dijit._Templated");

dojo.declare("gissoft.dijit.widgetOam", [dijit._Widget, dijit._Templated], {
    widgetsInTemplate: true,
    basePath: dojo.moduleUrl("gissoft.dijit"),
    templatePath: dojo.moduleUrl("gissoft.dijit", "templates/widgetOam.html"),

    constructor: function () {

    },

    postMixInProperties: function () { 

    },

    postCreate: function () {

    },

    startup: function () {

    }

});

And in file widgetOam.html(templatePath)

<div> <!-- do not add tag <html> , <head> , <body> but must have <div> first -->
    Hello World.
</div>

And this is how to call widget from my Default.aspx

You must add this before you call the dojo library

<script>
   djConfig = {
       parseOnLoad: true,
       baseUrl: './',
       modulePaths: { 'gissoft.dijit': 'js/gissoft/dijit' }
   };
</script>

And in the body

<body class="tundra">
    <form id="form1" runat="server">
    <div>
        <div data-dojo-type="gissoft.dijit.widgetOam"></div>
    </div>
    </form>
</body>
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)