Welcome, Guest
Username: Password: Remember me

TOPIC: Javascript on submit: weird evaluation sequence

Javascript on submit: weird evaluation sequence 2 years 2 weeks ago #85534

  • jay_ar
  • jay_ar's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 14
  • Karma: 0
I'm having to re-invent the wheel to some degree (more on this later), and the dumbest of the problems is keeping me from doing so. I've been chasing red herrings for the last few hours and I have not progressed much, so I hope some new eyes may help me a bit...

I'm running the last release of 1.92+. I created a 1-question test survey, a list-radio with 3 options (A,B & C). I created a 2nd group with some dummy text displays to see what was going on. Then I added the same code (below) at three different places: under the Group 1 description ("GR1"), Question 1 ("Q1") question source and Group 2 description ("GR2"). The code is the following:
<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		// Interrupt next/submit
		$('form#limesurvey').submit(function(){
			if ({if(Q01=="A",1,0)}){
			  alert ("Q1: Option A");
			} else if ({if(Q01=="C",1,0)}){
			  alert ("Q1: Option C");
			} else {
			  alert ("Q1: Option B");
			}
		});
	});
</script>

The alert message is changed slightly (GR1/Q1/GR2) so I can determine which script I am looking at.

If I test the "survey", and select the 3rd radio button, I get (in sequence) the following:
GR1: B (independent of the option chosen)
Q1: A (independent of the option chosen)
GR2: C (changes with the option I chose)

...meaning the code for group 1 is called first, but the value of Q01 doesn't match the actual value, and the code advances up to the last else. Then the code for Q1 is called, but this time the evaluation of the first "if" ALWAYS returns true. Only when the code on the 2nd page gets executed I get the expected results.

I thought by the time the "submit" function for a page was called the value of all the questions on that page were already known, but apparently this is not the case. The question is then: how do I get the right values on the 1st group?

/* ********************* bonus question ********************** */
(Sorry for the lenght of this post, but there's a good chance all of this is not necessary and I have wasted several hours of my time doing this. So, before I waste more time...)
Here's the "re-invent the wheel" thing: The actual survey I'm working on needs to be on one of two languages, or in both of them. That is, if the person choses either language A or B, the whole survey is displayed in that language (the language selector is hidden). If the person wants to, though, he/she should be able to select a third option, in which case the language selector should be displayed. The idea is to store in the database the language the subject used for each group.

The radio buttons on the first part of my questions will be used to select the language (English/Spanish/both). I'm using the expression manager to display the language selector for the 3rd case, but I need to switch to the right language if the person chooses one of the first 2 alternatives. What's the easiest way to do this? I thought the answer was javascript, but the JS gods seem to think differently :(
Attachments:
Last Edit: 2 years 2 weeks ago by jay_ar. Reason: typo
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 2 weeks ago #85562

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4207
  • Thank you received: 791
  • Karma: 360
Why not just skip the whole EM thing in the first group:
<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		// Interrupt next/submit
		$('form#limesurvey').submit(function(){
			if ($('input.radio:checked').attr('value') == 'A'){
				alert ("Q1: Option A");
			} else if ($('input.radio:checked').attr('value') == 'C'){
				alert ("Q1: Option C");
			} else {
				alert ("Q1: Option B");
			}
		});
	});
</script>
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 2 weeks ago #85563

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4207
  • Thank you received: 791
  • Karma: 360
And we can add question-specific selectors if you have more than one radio question on that page:
<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		// Interrupt next/submit
		$('form#limesurvey').submit(function(){
			if ($('#question123 input.radio:checked').attr('value') == 'A'){
				alert ("Q1: Option A");
			} else if ($('#question123 input.radio:checked').attr('value') == 'C'){
				alert ("Q1: Option C");
			} else {
				alert ("Q1: Option B");
			}
		});
	});
</script>
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 2 weeks ago #85567

  • TMSWhite
  • TMSWhite's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 759
  • Thank you received: 82
  • Karma: 36
Mixing EM and Jquery in that fashion is not a good idea. EM contains one big function that is called each page to do all of the substitution. document.ready() functions are called each time a value changes. Thus, by mixing them as you did, you get the strange evaluation sequence you describe (a mix of procedural and event-driven code); and there is no guarantee that the evaluation sequence would be the same across browsers.

So, in order to accomplish your goal, you should either use pure JavaScript (as tpartner described), or pure EM.

It looks like you're just trying to view the status of some variables. You can do that easily in EM via tailoring. If you want to see the current value of Q01 in group two, simply put the following EM code somewhere in group 2:
{Q01}

If you want to show the displayed value (e.g. 'Option A') instead of the internally coded value ('A'), use:
{Q01.shown}
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 2 weeks ago #85576

  • jay_ar
  • jay_ar's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 14
  • Karma: 0
Thank you guys.
Skipping the EM seems to be the way to go :) I just didn't know how to put this in code using 100%JavaScript (my experience with JS is close to nil), and I didn't know if the problems I was having were because of bad coding or bad assumptions, and apparently it's the later :)

Tom: what I'm trying to do -eventually- is to change the language for the rest of the survey based on the answer to Q1. The built-in language changer doesn't work for me because I need to offer an additional option, so I decided to code another one from scratch, using code that -I thought- is executed only when the user presses the "next" button, assuming that by that point the information would be up to date. From your post I understand EM evaluates the values only after the submit() functions are executed. Is this correct?

BTW: sometimes it looks like EM gets "out of tune". I had a hard time yesterday with a relevance equation of the type Qn=="Y", where Qn is a radio button. When testing the group this never evaluated to "true", and the question where I was using the relevance equation never showed up. Even using Qn==Qn the question didn't show,but if I replaced the relevance equation with a "1" things worked as they should. I checked the logic of the question, the group and the whole survey, and everything was reported to be correct.
After a looong time trying to figure out what was going on, I copied the group into another test survey, and lo and behold the very same code worked. Then I tested the group on the original survey again but it still wasn't working (and still doesn't). Finally I decided to try the survey to see if the evaluation worked when the survey was running (not just testing one group), and it did work. After I'm done with the current work I would love to know what's going on...
Last Edit: 2 years 2 weeks ago by jay_ar.
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 2 weeks ago #85579

  • TMSWhite
  • TMSWhite's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 759
  • Thank you received: 82
  • Karma: 36
jay_ar-

Given what you describe, the reason EM worked in one survey and not in another is probably due to errors in your JavaScript. People occasionally post saying that EM doesn't work, and 99.9%+ of the time, it is due to bad custom JavaScript or bad templates. EM has been around for over a year now and is essentially rock solid.

So, I recommend you take a closer look at the JavaScript in the survey that didn't work correctly. FireBug is a convenient way for debugging JavaScript in Firefox.

Also, EM processes changes with each onchange and TAB events. So, any time you alter the value of a question or leave it, EM runs (e.g. it runs before the submit button is processed).

-Tom
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 2 weeks ago #85582

  • jay_ar
  • jay_ar's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 14
  • Karma: 0
I installed Firebug, but I still have to find out how to use it along Limesurvey... we'll see.

I don't doubt for a minute there's an error in my coding. The problem is finding where the problem is :) Is it possible the code for a previous page (there are 45 of them) is creating the problem, or should I concentrate in the current page? I don't have duplicate identifiers, so it sounds weird something like this happens (I have seen this kind of problems before in other languages when messing around with the stack or memory allocation, but I'm not doing anything like hat here). Does it help to know the very same group/code/template works when it's by itself or in execution mode, but doesn't work when it's inside the main survey in test mode?

About the execution sequence, I'm still baffled by the difference in responses I get from the same code when it's executed in different locations after the [next] button is pressed. I'll have to take a look at the code when I'm done to see how it works

Thanks!

PD: I don't know what I don't know so, just to make sure, does it make sense to change the language using Javascript?
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 2 weeks ago #85623

  • jay_ar
  • jay_ar's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 14
  • Karma: 0
All right... I'm in end-of-rope mode.
I can think of two ways of changing the language within the group javascript:

1. Change the language directly using javascript
2. Add a hidden language selector and change the selected language depending on the input for the 1st question.

The most promising (i.e. close-to-working) approach has been using $('[name=move]').val('changelang_es');

but when I press the "next" button I'm returned to the same page (group1). Attempting to debug with Firebug lands me inside jquery.js

As for option 2, I don't know if the language selector can be handled as a regular drop-down list. Can the value be changed using $('#questionQQ').val(Qcode) or something to that tune?

Once again, I apologize for the idiotic questions.
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 1 week ago #85654

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4207
  • Thank you received: 791
  • Karma: 360
I don't think you can switch the language AND move to the next group/question. The core code reloads the current group/question when it detects a language switch.
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Re: Javascript on submit: weird evaluation sequence 2 years 1 week ago #85680

  • jay_ar
  • jay_ar's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 14
  • Karma: 0
Thank you for your patience!

Advancing to the next group is not a requirement. The problem I'm having right now is that the way it's written, the code executes only when the "next" button is pressed. Unfortunately, as you say, as soon as the language is changed the code that takes you to the next page is never reached, and the current group is displayed again in the language you just selected.

Checking the code for the "language switch" control, I found that the onChange event is as follow:
<select id="answer39614X105X1202" onchange="document.getElementById('lang').value=this.value; checkconditions(this.value, this.name, this.type);" name="39614X105X1202">

So, at least conceptually (correctness is a whole other story), this should work:
<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		if ($('input.radio:checked').attr('value') == 'A'){
			document.getElementById('lang').value='es';
			checkconditions(this.value, this.name, this.type)
		} else if ($('input.radio:checked').attr('value') == 'C'){
			document.getElementById('lang').value='en';
			checkconditions(this.value, this.name, this.type)
		}
	});
</script>

...but, alas, no joy.
The administrator has disabled public write access.
Moderators: ITEd
Time to create page: 0.274 seconds
Donation Image