Tag for json

JSONP 實做：使用 Google Ajax Search

Posted by essoduke - 2009 年 07 月 14 日 20:19:27 - 765 User Views
 

範例網頁：JSONP 實做：使用 Google Ajax Search

Google Ajax Search with JSONP

※ 詭異的是，我使用 $.get 都只能收到 400 Bad Request，只能用 $.ajax 才能正常。

  1. $.ajax({
  2.       url: 'http://ajax.googleapis.com/ajax/services/search/web',
  3.       data:{
  4.         'key': gsearch.key,
  5.         'v': '1.0',
  6.         'q': encodeURIComponent(k), // + '+site:essoduke.org' 搜尋網站,
  7.         'rsz': 'large',
  8.         'hl': 'zh-TW',
  9.         'start': s
  10.       },
  11.           dataType: 'jsonp',
  12.           success: gsearch.fetch
  13.     });

參考資料：

jQuery FlyDOM 樣板系統範例

Posted by essoduke - 2009 年 04 月 09 日 20:39:35 - 863 User Views

範例連結：jQuery FlyDOM 樣板系統範例

這個範例將伺服器端定位為資料提供者，所有的排版、定位等都交給使用者端來運算，也因為如此，所以特地試做了「檢視方式」清單，效果還不錯，只是還有幾個小問題要解決。

除了三種樣式作成樣板物件之外，包括分頁選擇也都獨立成樣板，伺服器端的頁數資料我也是用 JSON：

  1. //css 的值就是各頁數的樣式類別
  2. [{'page':'1', 'css':'selected'}, {'page':'2', 'css':''}]

為了讓總筆數和「目前顯示」資料能正確使用並減少伺服器存取的次數，我把這個項目也列入資料產出的 JSON 並放到最後，所以每次查詢資料就會有這項資訊可以使用，不用再額外撈一次：

  1. [{'id':'1', 'player':'Paul Konerko'....}, ......, {'records':'18', 'display':'1-9'}]

※ 資料使用 MLB 2009-04-07 白襪對皇家例行賽的打者成績，直接建立成 JSON 所以無法進行刪除，而修改也沒完成，反正只是 FlyDOM 的範例嘛…

這是預設的「詳細資料」樣式。

jQuery FlyDOM 樣板系統範例

檢視方式的下拉選擇清單，只需要簡單的定位就能完成。

jQuery FlyDOM 樣板系統範例 - 檢視方式清單

圖示檢視，這個順便用了 jQuery UI 做了拖曳排序的效果。

jQuery FlyDOM 樣板系統範例 - 圖示檢視

清單檢視

jQuery FlyDOM 樣板系統範例 - 清單檢視

參考資料：

台灣三碼郵遞區號 JSON 版

Posted by essoduke - 2009 年 01 月 21 日 20:41:19 - 1,305 User Views

最近有個案子有做到三碼郵遞區號填寫的部份，而中華郵政網站上提供的只有 Word, Excel 和 TXT 格式，索性就自己造檔，轉成 JSON 格式可讀性比較高、維護也方便，而且許多伺服端語言都有 JSON Library 可以使用。

zipcode.js

可以使用下列方法來個別取出：

  1. //縣市
  2. for (var county in zipcode){
  3. ...
  4. }
  5.  
  6. //鄉鎮市區
  7. for(var area in zipcode[county]{
  8.   ...
  9. }

範例應用：

那怎麼應用在 3+2 格式？最後兩碼讓訪客自己填就好了啊…XD

–
本來是想寫成 jQuery 的 Plugin，不過好像沒必要 :p

Powered by WordPress with GimpStyle Theme design by Horacio Bella.
Entries and comments feeds. Valid XHTML and CSS.