0

我创建了一个新的 dijit,其中包含模板中的一些标准 dijit。模板中的dijit好像没有启动。做这个的最好方式是什么?另外,如果我犯了任何其他错误,请告诉我,因为我上次使用 Dojo 大约是 3 年前......

更新我正在使用 Dojo 1.8 并依赖于自动需要的模块。我只有有限的能力来改变我正在使用的环境,因为这是一个更大项目的一个子集。

更新 2问题已在下面得到解答,但欢迎您对我的模板发现的任何问题发表评论... :-)

define([
"dojo/_base/declare",
"dijit/_WidgetBase", "dijit/_TemplatedMixin", 
"dojo/text!my/templates/CheckDate.html"
], function(declare, _WidgetBase, _TemplatedMixin, template){
    var x = declare("my.CheckDate", [_WidgetBase, _TemplatedMixin], {
        templateString: template,
    });
    return x;
});

模板:

<div class="row checkDate">
<div class="col paddingRightDiv third">
    <input type="checkbox" id="${name}_Check" data-dojo-type="dijit/form/CheckBox" />
    <label for="${name}_Check">${label}</label>
</div>
<div class="col paddingRightDiv half whenbox">
    <label for="${name}_Date">When might this be?</label>
    <input type="text" id="${name}_Date" name="${name}_Date" maxlength="6" data-dojo-type="dijit/form/TextBox" />
</div>
4

3 回答 3

4

要让 Dijits 进入您的模板,您需要添加dijit/_WidgetsInTemplateMixin

dijit 代码现在看起来像这样,展示了一个简单的事件处理程序。

define([
    "dojo/_base/declare",
    "dijit/_WidgetBase", 
    "dijit/_TemplatedMixin",
    "dijit/_WidgetsInTemplateMixin",
    "dojo/text!my/templates/CheckDate.html"
], function(declare, _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, template){
    var x = declare("my.CheckDate", [_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin], {
    templateString: template,
    showDate: function(e) {
        var attr = e ? "block" : "none";
        var id = this.when.id;
        dojo.style(id, "display", attr);            
    },
    });
return x;
});

模板代码已经简化了一点,使用${id]and connectNode

<div class="row checkDate">
<div class="col paddingRightDiv third">
    <input type="checkbox" id="${id}_Check" data-dojo-type="dijit/form/CheckBox" 
        data-dojo-attach-point="check" data-dojo-attach-event="onChange: showDate"/>
    <label for="${id}_Check" data-dojo-attach-point='containerNode'></label>
</div>
<div class="col paddingRightDiv half whenbox" id="${id}_When" data-dojo-attach-point="when" >
    <label for="${id}_Date">What Date?</label>
    <input type="text" class="miniTextBox" id="${id}_Date" name="${id}_Date" maxlength="5" 
           data-dojo-type="dijit/form/ValidationTextBox" promptMessage="Example: 10/14" data-dojo-props="pattern:'^[01]\\d\\/\\d\\d'" />
</div>
于 2013-07-09T07:58:11.767 回答
1

可以通过 HTML 中的简单 onClick 解决问题吗?

像 :

<input type="checkbox" id="${name}_Check" data-dojo-type="dijit/form/CheckBox" onClick="javascript:callMyFunction();" />

否则,您可以尝试将复选框连接到以下事件:

on("${name}_Check","click",function(){....});

或者

on("${name}_Check","click",callMyFunction);

更新1:

如果你想在开始时加载它,你可以像这样初始化它:

/**************Init-Bereich***************************/
var AnlagenStore;
var queryTaskAnlagenNummern, queryallAnlagenNummern;

dojo.ready(initKielAnlagenNummernSuchen);
function initKielAnlagenNummernSuchen(){

    queryTaskAnlagenNummern = new esri.tasks.QueryTask(restServicesLocation + NameSearchService + "/MapServer/23");

    queryallAnlagenNummern = new esri.tasks.Query();
    queryallAnlagenNummern.returnGeometry = true;
    queryallAnlagenNummern.outFields = ["ANLAGE"];

    require(["dojo/keys","dojo/dom","dojo/on"], function(keys, dom, on){
        on(dojo.byId("selectAnlagenNummer"), "keypress", function(evt){
            var charOrCode = evt.charCode || evt.keyCode;
            if (charOrCode == keys.ENTER) {
                zoomToAnlage();
            }
        });
    });

}
/**************Init-Bereich-ENDE***************************/

我在被调用的 Javascript-File 顶部加载这个以赶上 onkeypress 事件。dojo ready 向您保证 dojo 和所有功能都已加载

希望这可能会有所帮助。

问候,米里亚姆

于 2013-07-10T07:29:26.857 回答
0

我的第一个建议是它必须是

require([....,...],function(...){});

而不是定义。

作为参考,这里是 doje Template-Example 的一部分:

require([
 "dojo/_base/declare",
 "dijit/_WidgetBase",
 "dijit/_OnClickDijitMixin",
 "dijit/_TemplatedMixin",
 "dojo/text!./templates/SomeWidget.html"
  ],
   function(declare, _WidgetBase, _OnClickDijitMixin, _TemplatedMixin, template) {

    declare("example.SomeWidget", [_WidgetBase, _OnClickDijitMixin, _TemplatedMixin], {
    templateString: template
    //  your custom code goes here
    });

});

这是它的链接:http: //dojotoolkit.org/documentation/tutorials/1.7/templated/

也许将定义更改为要求以正确加载小部件就足够了。

问候,米里亚姆

于 2013-07-09T07:24:30.067 回答