Timing questions caused custom code to stop functioning | XM Community
Question

Timing questions caused custom code to stop functioning

R
Rank
Userlevel 2
Badge +4

Hello

I recently added some timing questions to my survey without realising they caused my custom javascript to cease functioning (I am assuming this as no other changes were made). However, after removing all the timing questions the code still doesn’t function. 

 

The code is supposed to take a value entered by the respondents and perform some functions upon the click of a button. These values are then displayed to the respondent. 

 

Does anyone know what might be causing this and how to fix the problem. 

 

Thanks in advance.

15 replies

Deepak
Rank
Userlevel 7
Badge +35

@RElsdon 

Have you tried restoring the previous version when the code was working?

 

R
Rank
Userlevel 2
Badge +4

Hi Deepak 

Thanks for your suggestion. On doing so I found out the code was actually working after inputting timing Qs. The real fault seems to have occurred after our PM entered our required quotas. For some reason this made the code cease functioning. It has us both stumped. Any ideas?

 

Many thanks

TomG
Rank
Userlevel 7
Badge +27

@RElsdon - When a new quota is added, the default action on quota full is end survey and the default quota is 0. Perhaps that is the problem? 

R
Rank
Userlevel 2
Badge +4

Thanks for responding Tom, I’m not quite sure what you mean so I’ll just lay everything out that isn’t functioning.

Respondents enter a value which is bounded from 0 to their score from a previous part of the survey.

As you can see from the first image it seems to think the number entered is 1 even before the button is clicked.

Is there any way the quotas have messed with this. I rolled back the versions until I found the working one and the only changes were inputting the quotas through the dashboard. I initially tried copying into a new survey and deleting all the quotas, but in that version when all quotas were deleted the calculator still remained non-functional.

NOT functioning - score 77
​​​​​
Functioning, before button click - score 60
Functioning, after button click - score 60

 

<p>Calcolatore delle tasse</p>

<p id="calculate button"><br></p>
<button id="calc" type="button">Calcola</button><br>
<br>

<table border="2" dir="ltr">
 <tbody>
  <tr>
   <th scope="row" style="width: 80px;">&nbsp;Intervallo<br>
   &nbsp;</th>
   <td style="width: 55px; text-align: center;"><span style="text-align: start;">0 - 10</span></td>
   <td style="width: 70px; text-align: center;">11 - 20</td>
   <td style="width: 70px; text-align: center;"><span style="text-align: start;">21 - 30</span></td>
   <td style="width: 50px; text-align: center;"><span style="text-align: start;">30+</span></td>
   <td style="width: 50px; text-align: center;">Totale</td>
  </tr>
  <tr>
   <th scope="row" style="width: 80px;">&nbsp;Reddito&nbsp; &nbsp;imponibile&nbsp;</th>
   <td id="y1" style="width: 55px; text-align: center;">&nbsp;</td>
   <td id="y2" style="width: 70px; text-align: center;">&nbsp;</td>
   <td id="y3" style="width: 70px; text-align: center;">&nbsp;</td>
   <td id="y4" style="width: 50px; text-align: center;">&nbsp;</td>
   <td id="y5" style="width: 50px; text-align: center;">&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="width: 80px;">&nbsp;Aliquota&nbsp; &nbsp;fiscale<br>
   &nbsp;</th>
   <td style="width: 55px; text-align: center;">0%</td>
   <td style="width: 70px; text-align: center;">20%</td>
   <td style="width: 70px; text-align: center;">30%</td>
   <td style="width: 50px; text-align: center;">40%</td>
   <td style="width: 50px; text-align: center;">&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="width: 80px;">&nbsp;Tassa de&nbsp; &nbsp;pagare</th>
   <td id="t1" style="width: 55px; text-align: center;">&nbsp;</td>
   <td id="t2" style="width: 70px; text-align: center;">&nbsp;</td>
   <td id="t3" style="width: 70px; text-align: center;">&nbsp;</td>
   <td id="t4" style="width: 50px; text-align: center;">&nbsp;</td>
   <td id="t5" style="width: 50px; text-align: center;">&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="width: 80px;">&nbsp;Guadagno&nbsp; &nbsp;al netto&nbsp; &nbsp;delle tasse<span style="text-align: center;"></span></th>
   <td id="yt1" style="width: 55px; text-align: center;">&nbsp;</td>
   <td id="yt2" style="width: 70px; text-align: center;">&nbsp;</td>
   <td id="yt3" style="width: 70px; text-align: center;">&nbsp;</td>
   <td id="yt4" style="width: 50px; text-align: center;">&nbsp;</td>
   <td id="yt5" style="width: 50px; text-align: center;">&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="width: 80px;">&nbsp;Reddito&nbsp; &nbsp;finale<br>
   <span style="text-align: center;">&nbsp;(prima del&nbsp; &nbsp;processo&nbsp; &nbsp;di verifica&nbsp; &nbsp;e&nbsp; &nbsp;controllo)</span></th>
   <td colspan="4" rowspan="1" style="text-align: center;">&nbsp;</td>
   <td id="total" style="width: 50px; text-align: center;">&nbsp;</td>
  </tr>
 </tbody>
</table>
function formatValue(value) {
  // Check if the value is a whole number
  if (value % 1 === 0) {
    return value.toFixed(0); // Display as an integer
  } else {
    return value.toFixed(2); // Display with 2 decimal places
  }
}

function Calc() {
  let text = document.querySelector("input[type=text]");
  let y = parseInt(text.value);
  let score = parseInt('${gr://SC_cT0uGBHILsp0UTQ/Score}');
	var reported_income = 0; // Initialize with a default value


	Qualtrics.SurveyEngine.setEmbeddedData("reported_income", y);

let y1;
  if (y === 0) {
    y1 = 0;
  } else if (y > 10) {
    y1 = 10;
  } else {
    y1 = y;
  }
  document.getElementById("y1").innerText = y1;

let y2;
if (y <= 10) {
  y2 = 0;
} else if (y > 20) {
	y2 = 10;
} else {
  y2 = (y - 10);
}
document.getElementById("y2").innerText=y2;


let y3;
if (y <= 20) {
  y3 = 0;
} else if (y > 30) {
	y3 = 10;
} else {
  y3 = (y - 20);
}
document.getElementById("y3").innerText=y3;


let y4;
if (y <= 30) {
  y4 = 0;
} else {
  y4 = (y - 30);
}
document.getElementById("y4").innerText=y4;


let y5=y;

document.getElementById("y5").innerText=y5;

let c1;
	if (score === 0) {
  c1 = 0;
} else if (score > 10) {
	c1 = 10;
} else {
  c1 = score;
}	

let c2;
if (score <= 10) {
  c2 = 0;
} else if (score > 20) {
	c2 = 10;
} else {
  c2 = (score - 10);
}

let c3;
if (score <= 20) {
  c3 = 0;
} else if (score > 30) {
	c3 = 10;
} else {
  c3 = (score - 20);
}


let c4;
if (score <= 30) {
  c4 = 0;
} else {
  c4 = (score - 30);
}


let c5=score;	

let t1=0
	document.getElementById("t1").innerText=t1.toFixed(2);

let t2=(y2*0.2)
	document.getElementById("t2").innerText=t2.toFixed(2);

let t3=(y3*0.3)
	document.getElementById("t3").innerText=t3.toFixed(2);

let t4=(y4*0.4)
	document.getElementById("t4").innerText=t4.toFixed(2);

let t5=(t2+t3+t4)
	document.getElementById("t5").innerText=t5.toFixed(2);


let T1=0
	document.getElementById("t1").innerText=t1.toFixed(2);

let T2=(c2*0.2)
	document.getElementById("t2").innerText=t2.toFixed(2);

let T3=(c3*0.3)
	document.getElementById("t3").innerText=t3.toFixed(2);

let T4=(c4*0.4)
	document.getElementById("t4").innerText=t4.toFixed(2);

let T5=(T2+T3+T4)
	document.getElementById("t5").innerText=t5.toFixed(2);



let yt1=(y1 - t1)
	document.getElementById("yt1").innerText=yt1.toFixed(2);

let yt2=(y2 - t2)
	document.getElementById("yt2").innerText=yt2.toFixed(2);

let yt3=(y3 - t3)
	document.getElementById("yt3").innerText=yt3.toFixed(2);

let yt4=(y4 - t4)
	document.getElementById("yt4").innerText=yt4.toFixed(2);

let yt5=(yt1+yt2+yt3+yt4)
	document.getElementById("yt5").innerText=yt5.toFixed(2);


let cT1=10
	document.getElementById("yt1").innerText=yt1.toFixed(2);

let cT2=(c2 - T2)
	document.getElementById("yt2").innerText=yt2.toFixed(2);

let cT3=(c3 - T3)
	document.getElementById("yt3").innerText=yt3.toFixed(2);

let cT4=(c4 - T4)
	document.getElementById("yt4").innerText=yt4.toFixed(2);

let cT5=(cT1+cT2+cT3+cT4)
	document.getElementById("yt5").innerText=yt5.toFixed(2);




let e1=(0)


let e2=(score)
if (y === score) {
  e2 = 0;
} else if (y < score) {
	e2 = (c2 - y2);
}


let e3=(score)
if (y === score) {
  e3 = 0;
} else if (y < score) {
	e3 = (c3 - y3);
}


let e4=(score)
if (y === score) {
  e4 = 0;
} else if (y < score) {
	e4 = (c4 - y4);
}


let e5=(e2 + e3 + e4)


let total = yt5 + score - y;
  document.getElementById("total").innerText = formatValue(total);
}


Qualtrics.SurveyEngine.addOnload(function() {
  /*Place your JavaScript here to run when the page loads*/
  Calc();

});

Qualtrics.SurveyEngine.addOnReady(function() {
  /*Place your JavaScript here to run when the page is fully displayed*/
  let button = document.querySelector("[type=button]");

  button.addEventListener("click", function() {
    Calc();
  });

});

Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
	/*Place your JavaScript here to run when the page is unloaded*/


	function Calc() {

 let text=document.querySelector("input[type=text]")

    let y1;
    let y=parseInt(text.value);
    let score=parseInt(' ${gr://SC_cT0uGBHILsp0UTQ/Score}  ');

	Qualtrics.SurveyEngine.setEmbeddedData("reported_income", y);

if (y === 0) {
  y1 = 0;
} else if (y > 10) {
	y1 = 10;
} else {
  y1 = y;
}	


let y2;
if (y <= 10) {
  y2 = 0;
} else if (y > 20) {
	y2 = 10;
} else {
  y2 = (y - 10);
}



let y3;
if (y <= 20) {
  y3 = 0;
} else if (y > 30) {
	y3 = 10;
} else {
  y3 = (y - 20);
}



let y4;
if (y <= 30) {
  y4 = 0;
} else {
  y4 = (y - 30);
}



let y5=y;



let c1;
	if (score === 0) {
  c1 = 0;
} else if (score > 10) {
	c1 = 10;
} else {
  c1 = score;
}	

let c2;
if (score <= 10) {
  c2 = 0;
} else if (score > 20) {
	c2 = 10;
} else {
  c2 = (score - 10);
}

let c3;
if (score <= 20) {
  c3 = 0;
} else if (score > 30) {
	c3 = 10;
} else {
  c3 = (score - 20);
}


let c4;
if (score <= 30) {
  c4 = 0;
} else {
  c4 = (score - 30);
}


let c5=score;	

let t1=0


let t2=(y2*0.2)


let t3=(y3*0.3)


let t4=(y4*0.4)


let t5=(t2+t3+t4)


	Qualtrics.SurveyEngine.setEmbeddedData("taxdue_nonaud", t5);


let T1=0


let T2=(c2*0.2)


let T3=(c3*0.3)


let T4=(c4*0.4)


let T5=(T2+T3+T4)

	Qualtrics.SurveyEngine.setEmbeddedData("taxdue_aud", T5);	



let yt1=(y1 - t1)


let yt2=(y2 - t2)


let yt3=(y3 - t3)


let yt4=(y4 - t4)


let yt5=(yt1+yt2+yt3+yt4)



let cT1=10


let cT2=(c2 - T2)


let cT3=(c3 - T3)


let cT4=(c4 - T4)


let cT5=(cT1+cT2+cT3+cT4)





let e1=(0)


let e2=(score)
if (y === score) {
  e2 = 0;
} else if (y < score) {
	e2 = (c2 - y2);
}


let e3=(score)
if (y === score) {
  e3 = 0;
} else if (y < score) {
	e3 = (c3 - y3);
}


let e4=(score)
if (y === score) {
  e4 = 0;
} else if (y < score) {
	e4 = (c4 - y4);
}




let e5=(e2 + e3 + e4)

	Qualtrics.SurveyEngine.setEmbeddedData("evaded", e5);	



let total=(yt5 + score - y)

	Qualtrics.SurveyEngine.setEmbeddedData("total", total);	




 }

	Calc();

});

 

TomG
Rank
Userlevel 7
Badge +27

Quotas wouldn’t have any impact on your JavaScript or html.  So, it isn’t that.

R
Rank
Userlevel 2
Badge +4

Is there any way to diagnose the issue? 

R
Rank
Userlevel 2
Badge +4

I’ve been through the versions to find the one that caused the issue. Here are the changes which were made on the first version that failed.

TomG
Rank
Userlevel 7
Badge +27

@RElsdon,

I don’t think anything listed there would cause the issue. There was probably some other change that isn’t showing there.

Add strategically placed console.log() or debugger statements to your JS to figure out what is going on. 

R
Rank
Userlevel 2
Badge +4

I’ve attached images of the console log.

 

As you can see the value of y is not being overwritten when the button is clicked. It is given the value 1 which remains unchanged.

 

Thanks in advance

5 Attachments
R
Rank
Userlevel 2
Badge +4

Adding debug statements stopped the code when the page loaded. As you can see the score 40 is correctly shown but y is giving 1 instead of 40. y should be equal to the score.

 

It didn’t stop the page for the working version that I’ve got. 

 

R
Rank
Userlevel 2
Badge +4

 The flagged bits in the code in full

 

R
Rank
Userlevel 2
Badge +4

Not working 

 

Working 

 

R
Rank
Userlevel 2
Badge +4

“let y=parseInt(text.value)” usually has text.value highlighted, but here it doesn’t seem to be recognised as a variable.

 

R
Rank
Userlevel 2
Badge +4

Here is a list of the changes made by our PM. Does anyone have any idea how this could be happening?

  1. Adding embedded data in survey flow – relates to panel partner variables to capture the unique IDs and security terminates setup.
  2. Adding terminations in the survey flow.
  3. Changing “end of survey” to “end of block” in survey builder.
  4. Survey options – enabling prevention of security bots, fraudulent, duplicates.
  5. Quotas page - Creating quotas based on questions.
R
Rank
Userlevel 2
Badge +4

We have now narrowed down the fault to changing the survey security options. The changes made were: prevent multiple submissions, bot detection, security scan monitor, releventID, prevent indexing.

Having discussed this with Qualtrics support here are a few issues that could have caused our problems.

 

“Partial data with individual links (email, personal, etc) are saved in association with a contact.

Partial data with anonymous links are saved through cookies. This could be interfering with code if you code relies on cookies. 

The security options like bot detection and relevantID use outside tech link captcha. This may affect your coded dependent of what your code is doing and using.”

 

Does anyone know how we could workaround this issue?

Leave a Reply


Terms & Conditions