ThoughtBot开发的Jester库可以让你通过JS访问REST API，它提供了与ActiveRecord类似的语法，并同时支持JSON与XML。
Category Archives: JS
YUI: Yahoo! Web UI库
YUI是Yahoo!提供的一组JS实现的开源Web UI库，基于BSD协议，目前包括拖拽（drag and drop），自动完成（autocomplete），日历（calendar），颜色挑选（color picker），数据表（data table），日志（logger），菜单（menu）等等。 使用很简单，以日历控件为例： <link rel=”stylesheet” type=”text/css” href=”http://yui.yahooapis.com/2.2.0/build/calendar/assets/calendar.css”> <script type=”text/javascript” src=”http://yui.yahooapis.com/2.2.0/build/yahoo-dom-event/yahoo-dom-event.js”></script> <script type=”text/javascript” src=”http://yui.yahooapis.com/2.2.0/build/calendar/calendar-min.js”></script> <span id=”cal1Container” style=”width: 200px; display: block; float: none”></span> <input id=”obj_test” name=”obj[test]” readonly=”yes” size=”12″ value=”2007-11-14″ /> <script type=”text/javascript”> function selectDay(stuff, days) { $(‘obj_test’).value = “” + days[0][0][0] + “/” + days[0][0][1] + “/” + days[0][0][2] [...]
Posted in JS 5 Comments
RJS实现Select级联
还记得前面的那个Ajax Select的例子吗？实际上实现像国家，城市这样option已经确定的select的级联并没有必要使用Ajax，通过客户端JS就可以轻松实现，而不必向服务端发送请求。 1. 生成person resource script/generate person country:string state:string 由于不再需要向服务端发送请求，因此没有必要生成一个单独的city resource。 2. 执行rake db:migrate 3. 修改app/views/layouts/people.rhtml，包含prototype： <%= javascript_include_tag ‘prototype’ %> 4. 修改app/views/people/new.rhtml: <%= update_page_tag do |page| page << “function change_state(country_value) {” page << ‘if(country_value == “United States”)’ page['person_state'].replace_html options_for_select(US_STATES) page << ‘else if(country_value == “China”)’ page['person_state'].replace_html options_for_select(CHINA_STATES) page << ‘else’ page['person_state'].replace_html options_for_select([['Not applicable', '']]) [...]
Also posted in AJAX Leave a comment
Plotr：轻量级的Javascript制图库
简介 Plotr是一个基于PlotKit与MochiKit的轻量级Javascript制图库，目前支持的浏览器包括： Firefox 1.5+ Safari 2.0+ Opera 9.0+ IE6+（作者声称支持，但我的测试结果是不行，至少IE6不行） 作者：sabmann 最新版本：0.2.0 下载：http://code.google.com/p/plotr/downloads/list 许可：BSD License 使用 Plotr依赖于prototype以及HTML Canvas，因此需要包含3个JS文件： <script src=”prototype.js” type=”text/javascript”></script> <script src=”excanvas.js” type=”text/javascript”></script> <script src=”plotr.js” type=”text/javascript”></script> Plotr的使用相当简单，下面是Plotr的官方示例： <div><canvas id=”bars1″ height=”300″ width=”500″></canvas></div> <script type=”text/javascript”> // Define a dataset. var dataset = { ’myFirstDataset’: [[0, 1], [1, 1], [2, 1.414], [3, 1.73], [4, 2.56]], ’mySecondDataset’: [[0, 0.3], [...]
