[JavaScript] 將 CSV 檔案轉換成 JSON 資料

我們在拿到客戶提供的資料的時候常常會拿到 excel 檔案(這算幸福的)
至少我們可以簡單的利用一些軟體轉成 csv丟進資料庫裡處理。如果搭配個後端 API 基本上資料都不會是太大的問題可以做成 JSON 供 JavaScript 使用,但是如果在沒有後端或是資料庫的環境中呢?


首先我們先把 csv 檔案放到 server上 利用 $.get() 取得內容,接著將內容String 丟進我們待會會用到的 csvJSON 外掛 function 中。就會取得 JSON
但是這個時候的 JSON 還是 String 的形態所以還無法被解析,我們再加個 JSON.parse() 就可以拿到整個 JSON 物件摟!


function 來源:
https://gist.github.com/iwek/7154578

jQuuery UI 打造美觀的 alert 介面

早期我們在編寫網頁的時候如果要出現彈出警告,通常都會用JS的alert語法。例如:

alert("錯誤訊息");

這樣產生出來的訊息就只會是這樣:

其實我們在jQuery UI的協助下可以做出比較美觀的介面。像這樣:

這次我們選用Dialog這個樣式功能,它的原理其實很簡單,先建立一個專屬的div這個div的名稱將會和jQuery的程式與法對應。如下圖:
由於這個function的原理是呼叫一個div出來顯示,所以你裡面想要包什麼東西都可以。圖檔、連結、表格等等通通可以塞進去。

其實最簡單乾淨的語法只是這樣就可以執行:
$(function() {
$( "#dialog-modal" ).dialog();
});

其他的東西都是參數而已,例如我們如果要再加上背景遮罩的話就在.dialog()動作中再加上

modal: true

變成
$(function() {
$( "#dialog-modal" ).dialog({
modal: true
});
});



大家試試看吧!還有更多的細部設定都可以在jQuery UI的官方網站中找到

留言

這個網誌中的熱門文章

利用 google MAP API 取得座標之間的距離

JavaScript 將 Array 和 Object 轉成 JSON

讓 PHP 接收 post 的 json 資料