iT邦幫忙

0

Limesurvey進階應用--multiple numerical input題型子題數值連動輸入

  • 分享至 

  • xImage
  •  

Limesurvey中的multiple numerical input題性,是一個可以在題目中設定多個數值欄位的題型,這些數值欄位稱為子題(subquestion)。由於子題之間往往會有相互關聯性,因此有時候我們會希望當某個子題輸入特定數值時,其他子題也帶入相同或特定數值。

情境說明

假設我們設計一個題目「請問在理想中,您希望有幾個小孩?男孩____個,女孩____個,合計____個」。
考量可能有人無法回答,因此我們也將設計特殊碼「96不知道,98拒答」,另外可能有人並沒有性別偏好,男生女生都好,所以男孩、女孩也增加特殊碼「95都可以」。
我們希望達到以下效果:

  1. 當填答者在男孩填答95、96、98時,自動於女孩欄位帶入相同數值。
  2. 當填答者在男孩及女孩填寫有效數值(0-20)時,自動加總填入合計欄位。

實作

首先,我們先建立此題的基本架構,設定題型為multiple numerical input,然後建立三個子題,子題編號分別為01、02、03。接著我們同樣用javascript做出此效果,做法如下:

<script type="text/javascript">
$(document).ready(function() { 
	// 監聽男孩(子題01)的數值變化
	$('#answer{self.sq_01.sgqa}').on('input', function() { 
		var value = $(this).val();  
		if (value == '95' || value == '96' || value == '98') { 
			// 將相同的數值填入女孩(子題02)欄位
			$('#answer{self.sq_02.sgqa}').val(value); 
		}
	}); 
   // 監聽女孩的數值變化,比照男孩的情況辦理
  	$('#answer{self.sq_02.sgqa}').on('input', function() { 
		var value = $(this).val(); 
			if (value == '95' || value == '96' || value == '98') { 
			$('#answer{self.sq_01.sgqa}').val(value); 
		}
	}); 
  //同時監聽男孩及女孩的數值狀況,若在0-20之間,於合計欄位(子題03)填入加總數值
  $('#answer{self.sq_01.sgqa}, #answer{self.sq_02.sgqa}').on('input', function() {
        var value1 = parseFloat($('#answer{self.sq_01.sgqa}').val()) || 0;
        var value2 = parseFloat($('#answer{self.sq_02.sgqa}').val()) || 0;

        // 檢查兩個數值是否在 0 到 20 之間
        if (value1 >= 0 && value1 <= 20 && value2 >= 0 && value2 <= 20) {
            // 計算加總並填入子題03
            $('#answer{self.sq_03.sgqa}').val(value1 + value2);
        } else {
            // 若數值不在範圍內,清除子題03的內容(可選)
            $('#answer{self.sq_03.sgqa}').val('');
        }
    });
});
</script>

程式碼中 "{self.sq_子題代號.sgqa}" 是Limesurvey的語法。self指「本題」之意,「sq_子題代號」為指定子題,最後的「sgqa」則是顯示該欄位實際在html中的代號之意。
只要將上面語法貼入題目的原始碼中即可。


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言