JS實現點選單選按鈕組彈出對話框輸入值

1.1 應用場景

在製作問卷調查類的範本時，可能會遇到這種情況：有幾個選項，最後一個選項為其他，當選擇其他時彈出一個對話框，允許使用者輸入其他值，然後顯示輸入值。如下圖所示：

1.2 實現思路

「單選按鈕組」元件新增「狀態改變」事件，判斷選擇其他時彈出對話框，將對話框中輸入內容指派給儲存格。API說明可以參考：API彙總

2.1 準備範本

1）建立範本，在 B1 儲存格新增「單選按鈕組元件」，設計報表樣式，如下圖所示：

2）點選選擇 B1 儲存格中「單選按鈕組元件」，在「元件設定>屬性>資料字典」處為其綁定資料，如下圖所示：

2.2 元件新增事件

點選選擇 B1 儲存格中「單選按鈕組元件」，在「元件設定>事件」處為元件新增一個「狀態改變」事件，如下圖所示：

JavaScript 代碼如下：

var value = this.getValue();
//獲取當前元件值
if (value == "其他") {
	FR.Msg.prompt("輸入", "愛好", "", function() {
		value = arguments[0] && arguments[0].toString();
		//獲取輸入框中輸入的值
		_g().setCellValue(0, 1, 1, value);
		//将值賦給B1儲存格
	})
} else {
	_g().setCellValue(0, 1, 1, value);
	//将值賦給B1儲存格
}

2.3 預覽效果

2.3.1 PC 端

儲存範本，選擇 「填報預覽」，效果如1.1節所示。

2.3.2 行動端

行動端及 HTML 5 效果如下圖所示：

點選下載範本：50-JS實現點擊單選按鈕彈出對話框輸入值.cpt