スライド 1

御社ホームページがYahoo、Google等のサーチエンジンに評価され上位表示される様にサポートを行います。
自力で開発 with Dojo が出来るようになるための
My開発スタイル 実演
ケートリック, LLC
www.ktrick.com
田付 和慶
([email protected])
Dojoはリファレンスが英語だからよくわからない。
Dojoを利用するときの開発スタイル
を今日は実演してみたいとおもいます。
【お題】
・カレンダーで出来る日にちを制限したい
→ 選択は当日2日先から60日先まで
Xpagesにこれを貼り付けたら動くよ (^^)/
<xp:inputtext id="djDateTextBoxDepart" required="true" role="button" value="#{sessionScope.djDateTextBoxDepart}">
<xp:this.defaultvalue><![CDATA[#{javascript:var tod:Date = @Today();
tod.setDate(tod.getDate() + 2);
return tod;}]]></xp:this.defaultvalue>
<xp:datetimehelper dojotype="" id="dateTimeHelperDepart">
<xp:this.dojoattributes>
<xp:dojoattribute name="constraints">
<xp:this.value><![CDATA[#{javascript:var tod:Date = @Today();
var maxdate:Date = @Today();
var mindate:Date = @Today();
maxdate.setDate(tod.getDate() + 62);
mindate.setDate(tod.getDate() + 2);
"{min:'"+I18n.toString(mindate, "yyyy-MM-dd")+"',max:'"+I18n.toString(maxdate, "yyyy-MM-dd")+"'}"}]]></xp:this.value>
</xp:dojoattribute>
<xp:dojoattribute name="onChange">
<xp:this.value><![CDATA[#{javascript:"var dd = new Date(this.get('value'));"+
"var aobj = dijit.byId('"+getClientId('djDateTextBoxArrive')+"');"+
"var da = new Date(aobj.get('value'));"+
"aobj.constraints.min = this.get('value');"+
"aobj.constraints.max = this.constraints.max;"+
"if( (dd.getTime() - da.getTime()) > 0) aobj.set('value', this.get('value'))"}]]></xp:this.value>
</xp:dojoattribute>
</xp:this.dojoattributes>
</xp:datetimehelper>
<xp:this.converter>
<xp:convertdatetime datestyle="short" pattern="yyyy/MM/dd" type="date">
</xp:convertdatetime>
</xp:this.converter>
</xp:inputtext>
コピペじゃなくて、
自分で開発出来ないと意味ないし・・・
ということで、
今回どのように開発を行い
Dojoのカレンダーコントロールをカスタマイズしていったのか
実際に開発スタイル、手法を実演したいと思います。
実演スタート!!