JS實現防止惡意提交

1.1 預期效果

在日常填報中，只要使用者能預覽網頁，就可以填報，這樣就會存在一些人惡意填報，生成一些垃圾資料。那如何避免此種情況呢？

可以透過設定效驗碼，在輸入效驗碼不正確情況下，填報「提交」按鈕不可用，無法提交，校驗碼正確時可以提交。如下圖所示：

1.2 實現思路

可以透過 JavaScript ，預先將填報按鈕設定為不可用，再根據輸入效驗碼判斷，如果效驗碼正確，則設定提交按鈕可用；如果校驗碼不正確，則提交按鈕不可用。

2.1 準備範本

 建立範本，設計報表表格，其中 B1、B4儲存格新增「數字元件」， B2、B3 儲存格新增「正文元件」。如下圖所示：

2.2 設定填報屬性

點選菜單欄「範本>報表填報屬性」，為範本設定填報屬性。選擇新增一個「內建SQL」提交，提交類型選擇「智慧提交」，表選擇 FRDemo 的 book 表，依次綁定入庫欄位。如下圖所示：

2.3 新增事件

1）首先要完成預先將填報按鈕設定為不可用，點選「範本>範本web屬性>填報頁面設定」，選擇「為該範本單獨設定」，在「事件設定」處新增一個「載入結束」事件。如下圖所示：

JavaScript 程式碼如下：

//設定工具欄填報按鈕不可用
setTimeout(function() {
	_g().getToolbar().getWidgetByName("submit").setEnable(false);
}, 100);
或
//設定工具欄填報按鈕不可用
setTimeout(function() {
     contentPane.toolbar.getWidgetByName("submit").setEnable(false);
}, 100);

2）接下來設定校驗功能。點選 B4 儲存格「數字元件」，為其新增一個「編輯後」事件，事件內容為初始化一個檢驗密碼，當輸入密碼正確時，填報提交按鈕可用，否則不可用。如下圖所示：

JavaScript 程式碼如下：

//獲取效驗碼輸入框的值
var a = _g().getWidgetByCell("B4").getValue();
//預設密碼為123
var b = 123;
//獲取按鈕物件
if (a != b) {
//如果輸入框的值不等於123，則提交按鈕不可用
	_g().getToolbar().getWidgetByName("submit").setEnable(false);
} else {
//否則可用，即輸入正確
	_g().getToolbar().getWidgetByName("submit").setEnable(true);
}

2.4 效果預覽

儲存範本，點選「填報預覽」，校驗碼輸入123 時，填報按鈕可用，否則不可用。如下圖所示：

注：不支援行動端。

點選可下載範本：JS實現防止惡意填報.cpt