JSON 驅動客戶端緩存與驗證：實現類 Ajax 的零刷新多組數據輸入體驗

痛點：傳統驗證混雜服務端代碼

JSP 中夾雜 `<%= minCC %>`、`<%= ResourceList.msg %>` 等服務端片段，導致客戶端腳本難維護、元數據變更牽一髮動全身、無法控制下發數據量。

JSON 方案：元數據前置緩存

服務端生成 JSON 字符串，注入頁面賦值給 JS 變量：

var vehicleValidationsMetadata = {
  "BrandName": {"CanContainDigits": false, "MaxWords": 2, "FormatMessage": "品牌名不可含數字", "WordLimitMessage": "最多兩個單詞"},
  "RegistrationNumber": {"CanContainAlphabets": false, "CanContainDigits": true, "FormatMessage": "注冊碼僅限數字"},
  "CC": {"minCC": 50, "maxCC": 5000, "FormatMessage": "CC必須為數字", "RangeMessage": "CC範圍50-5000"},
  "MIN_OCC": 0, "MAX_OCC": 10, "MAX_OCC_MSG": "最多10輛車", "MIN_OCC_MSG": "至少1輛車"
};

驗證邏輯純前端化

if (cc < vehicleValidationsMetadata.CC.minCC || cc > vehicleValidationsMetadata.CC.maxCC)
    alert(vehicleValidationsMetadata.CC.RangeMessage);

零服務端代碼混入，元數據變更只需更新 JSON 生成邏輯，JS 完全解耦。

客戶端數據緩存：多組/多值屬性的類 Ajax 體驗

• 用戶輸入一組車輛數據點擊「添加」→ `addVehicleData()` 將數據 push 入 `vehicleData[]` JS 數組 → 清空輸入框繼續輸入下一組，無需提交服務端、無頁面刷新。
• 元數據中定義 `MIN_OCC/MAX_OCC` 限制組數，前端即時校驗。
• 最終提交時 `JSON.stringify(vehicleData)` 序列化存入隱藏域提交服務端，服務端用 JSON API (如 json.org/java) 反序列化處理。

核心優勢

1. 面向對象緩存：避免隱藏域字符串拼接解析痛苦。
2. 邏輯與數據分離：驗證規則集中在 JSON，維護極簡。
3. 原生 Ajax 體驗：零刷新、極低響應延遲、批量提交。