[筆記] YUI widget Calendar 屬性修改

上次介紹到YUI有個好用的widget Calendar,而我們可以使用YUI2 in 3的方式來使用 ,今天收到一個bug就是『Calendar未抓取server時間』,當下我的感覺就是…

為什麼~為什麼~為什麼~
經過一番討論之後….我…..

屈服了~
畢竟事情還是要解決,因此採用方法如下:
1. php 輸出資料於頁面上
2. javascript 取得頁面資料
3. 將資料設定在YUI calendar

Step1.

<input type="hidden" name="today" id="today" value="<?php echo date("Y/m/d"); ?>" /><br></br>

Step2.

<script><br></br>valToday = Y.one("#today").get("value);<br></br></script><br></br>

到了Step3….
我卡關了!找了許久的YUI calendar API看到一線曙光。

一開始我,很傻很天真的以為直接就可以使用

<script><br></br> valToday = Y.one("#today").get("value);<br></br><br></br> Y.use('yui2-calendar', function (Y) {<br></br> YAHOO = Y.YUI2;<br></br> _calendar = new YAHOO.widget.Calendar('_calendar', 'calContent')<br></br> _calendar.configToday(valToday);<br></br> _calendar.render();<br></br> });<br></br></script><br></br><br></br>

結果發現…

心情頓時失落,只好重拾API,完完整整的重新閱讀一番,終於…

曙光出現了!
*
*
YUI calendar ExampleYUI calendar API互相參閱之下,我參透了~

Step3.

<br></br><script><br></br> valToday = Y.one("#today").get("value);<br></br><br></br> Y.use('yui2-calendar', function (Y) {<br></br> YAHOO = Y.YUI2;<br></br> _calendar = new YAHOO.widget.Calendar('_calendar', 'calContent')<br></br> _calendar.cfg.setProperty("today", valToday);<br></br> _calendar.render();<br></br> });<br></br></script><br></br>

Final.

最後免不了來一個Live demo
可以試著調整電腦時間,calendar還是會以Server date為主。

CaesarChi

Web developer, focus on website fullstack, special JavaScript, and love sharing developing experience and communicate with developers. http://about.me/clonn