ASP.NET AJAX技術在高校就業信息系統中的應用研究

黃衛 南昌航空大學科技學院

ASP.NET AJAX技術在高校就業信息系統中的應用研究

黃衛 南昌航空大學科技學院

分析了基于B/S信息系統中快速獲取報表數據需頻繁刷新的問題，利用AJAX技術和Echarts圖表工具設計了實時動態數據傳遞及用戶界面的無刷性。

AJAX 實時數據 Echarts JavaScript

就業數據統計和管理是高校就業工作的一個重要組成部分，尤其要對就業數據進行實時監控和查詢，為下一步就業目標提供依據。傳統方式利用電子表格工具生成報表再上報，效率不高、交互性不強，不能實現即時統計查詢。利用AJAX與Echarts技術異步獲取數據，實現動態圖文報表管理，后期加入時間戳實時刷新報表數據，更好地滿足了就業部門掌握實時就業動態。

1 AJAX技術和Echarts圖表工具

1.1 實時數據傳送分析

基于B/S的傳統web應用，用戶需要發送一次HTTP請求，服務器響應請求并回傳相關頁面，在這種數據傳輸的交互方式下，用戶端要不斷刷新頁面來獲取新數據，將耗費極大的資源，用戶體驗不好。而高校就業數據的報表遞交具有時效性、階段性，上級部門希望能實時掌握各院系就業動態，在數據報盤前完成就業目標。本文引入AJAX（即異步JavaScript和XML）技術，能很好的解決這一問題，頁面更新數據實現無刷新效果，用戶無需等待，還可以瀏覽頁面的其他部分。

1.2 AJAX技術

AJAX由JavaScript、CSS樣式表、XMLHttpRequest對象等多種技術組成，它可以實現異步傳輸、異步刷新功能，用戶不會被限制于等待狀態，不打斷用戶操作，從而加快了響應能力。

1.3 Echart圖表工具

ECharts，是基于html5-canvas的開源圖表繪制組件，可以流暢的運行在PC和移動設備上，兼容當前絕大部分瀏覽器，底層依賴輕量級的Canvas類庫ZRender，提供直觀、與數據庫交互、生成高度個性化的數據可視化圖表。

1.4 AJAX與Echars相結合

用戶端通過AJAX向服務器發送HTTP請求（HttpContext），實現異步查詢獲取數據庫后，將其傳入后臺，后臺將數據轉為JSON格式的數據后再傳給前臺。這里為顯示圖表劃出一個塊div區域, Echarts就可以直接使用JSON格式的回傳數據顯示數據庫中相應的數據，從而可以達到動態顯示的效果。期間，AJAX引入定時輪詢機制，定時訪問后臺數據庫，如有更新則提取數據（默認無更新數據時不作返回操作），將最終返回給Echarts直觀的顯示給用戶。Echarts重繪圖表過程，就是重新執行一次繪圖代碼，由于AJAX動態無刷新技術，用戶體驗感增強，無需專門等待。

2 系統實現

首先服務器端定義一個Serial類，接著將Serial實例化并將其轉化為json格式數據。而在客戶端與服務器之間創建一個ajax．js腳本文件，前臺代碼要用ajax來獲取服務器返回的數據并賦給option的serial屬性，運行效果如圖1所示：

圖1 部分頁面運行效果

3 結束語

開發設計一個交互、實時性強的就業信息系統，為高校就業部門快速掌握一線就業工作動態創造了良好的環境，本系統稍作改動可滿足類似需求，具有廣泛的應用范圍。

[1]劉乃琦，郭小芳. ASP.NET應用開發與實踐. 人民郵電出版社,2012-12

[2]ECharts特性.http://echarts.baidu.com/feature.html

[3]Echarts在.Net中使用實例.http://www.cnblogs.com/soundcode/p/6253522.html