Branch Logic And Embedded Data | XM Community
Skip to main content
Solved

Branch Logic And Embedded Data

  • January 21, 2025
  • 3 replies
  • 52 views

Forum|alt.badge.img+3
  • Level 2 ●●
  • 17 replies

Hello everyone,
I want to design a study on Qualtrics. In the study, participants will be allowed to spend the income they earned in previous stages. There are 8 spending options given to participants. I used branch logic in the stage of deducting the expenditure from the net income. However, it did not work completely. I am open to suggestions on this issue.

Thank you in advance.

Best.

Best answer by ahmedA

You could use JS inside a matrix constant sum question.

Here’s the demo: https://iima.au1.qualtrics.com/jfe/preview/previewId/00a1841e-33a5-49ae-a9c5-6934da853af4/SV_8HBDY4VRJnFn40J/BL_eWhyLPGnUXT8onQ?Q_SurveyVersionID=current

 

Qualtrics.SurveyEngine.addOnReady(function () {
	const quest = this;
	const qc = quest.getQuestionContainer();

	// Pipe your max amount here
	const maxAmount = parseInt("500");
	const alertText = "Please ensure the amount consumed is less than";

	const nextButton = document.querySelector("#NextButton");

	// Add a row below the total row
	const totalRow = qc.querySelector("tr.CSTotal");
	const remainingRow = totalRow.cloneNode(true);
	totalRow.insertAdjacentElement("afterend", remainingRow);

	// Give them total rows new labels for clarity
	totalRow.querySelector("th").innerHTML = "Amount Consumed";
	remainingRow.querySelector("th").innerHTML = 'Amount Left <small id="amountAlert" style="color: red;display:none;">+++++ $ _____.</small>';

	const totalInput = totalRow.querySelector("input");
	const remainingInput = remainingRow.querySelector("input");

	// Monitor changes to the total
	totalInput.oninput = function () {
		setTimeout(() => {
			const amountUsed = parseInt(totalInput.value.replaceAll(/\D/gm, ""));
			const amountLeft = maxAmount - amountUsed;

			// Update the remaining total with the amount left
			remainingInput.value = amountLeft;

			// Hide next button if amount consumed is more than available
			// Show the alert message in this case
			if (amountLeft < 0) {
				nextButton.style.display = "none";
				alertMessage.style.display = "block";
			} else {
				nextButton.style.display = "";
				alertMessage.style.display = "none";
			}
		}, 0);
	};

	// Start with the entire amount being available
	remainingInput.value = maxAmount;

	// Put values in the alert message
	const alertMessage = qc.querySelector("#amountAlert");
	alertMessage.innerHTML = alertMessage.innerHTML.replace("+++++", alertText);
	alertMessage.innerHTML = alertMessage.innerHTML.replace("_____", maxAmount);
});

 

View original

3 replies

Forum|alt.badge.img+3
  • Author
  • Level 2 ●●
  • 17 replies
  • January 21, 2025

 


Forum|alt.badge.img+22
  • Level 7 ●●●●●●●
  • 2028 replies
  • Answer
  • January 21, 2025

You could use JS inside a matrix constant sum question.

Here’s the demo: https://iima.au1.qualtrics.com/jfe/preview/previewId/00a1841e-33a5-49ae-a9c5-6934da853af4/SV_8HBDY4VRJnFn40J/BL_eWhyLPGnUXT8onQ?Q_SurveyVersionID=current

 

Qualtrics.SurveyEngine.addOnReady(function () {
	const quest = this;
	const qc = quest.getQuestionContainer();

	// Pipe your max amount here
	const maxAmount = parseInt("500");
	const alertText = "Please ensure the amount consumed is less than";

	const nextButton = document.querySelector("#NextButton");

	// Add a row below the total row
	const totalRow = qc.querySelector("tr.CSTotal");
	const remainingRow = totalRow.cloneNode(true);
	totalRow.insertAdjacentElement("afterend", remainingRow);

	// Give them total rows new labels for clarity
	totalRow.querySelector("th").innerHTML = "Amount Consumed";
	remainingRow.querySelector("th").innerHTML = 'Amount Left <small id="amountAlert" style="color: red;display:none;">+++++ $ _____.</small>';

	const totalInput = totalRow.querySelector("input");
	const remainingInput = remainingRow.querySelector("input");

	// Monitor changes to the total
	totalInput.oninput = function () {
		setTimeout(() => {
			const amountUsed = parseInt(totalInput.value.replaceAll(/\D/gm, ""));
			const amountLeft = maxAmount - amountUsed;

			// Update the remaining total with the amount left
			remainingInput.value = amountLeft;

			// Hide next button if amount consumed is more than available
			// Show the alert message in this case
			if (amountLeft < 0) {
				nextButton.style.display = "none";
				alertMessage.style.display = "block";
			} else {
				nextButton.style.display = "";
				alertMessage.style.display = "none";
			}
		}, 0);
	};

	// Start with the entire amount being available
	remainingInput.value = maxAmount;

	// Put values in the alert message
	const alertMessage = qc.querySelector("#amountAlert");
	alertMessage.innerHTML = alertMessage.innerHTML.replace("+++++", alertText);
	alertMessage.innerHTML = alertMessage.innerHTML.replace("_____", maxAmount);
});

 


Forum|alt.badge.img+3
  • Author
  • Level 2 ●●
  • 17 replies
  • January 22, 2025

Hello, thank you for your answer. I will try it. Thank you again.


Leave a Reply