Another disable "next" button question

More
2 years 9 months ago #111246 by jmdsbussrv
jmdsbussrv created the topic: Another disable "next" button question
OK, spent the past 3 hours searching the internet and the forum and trying to adapt the javascript code, but I can't get it to work the way I want. The button will be disabled, but will not enable when I want it to.

What I have is an "equation" type question that evaluates to either 1 or 0. If it is 0, then the Next button should be disabled. If it is a 1, then the button should be enabled.

I know this is simple, but I'm a bit burned out and can't seem to get it right.

Thanks in advance for the help.

Please Log in to join the conversation.

More
2 years 9 months ago #111281 by tpartner
tpartner replied the topic: Another disable "next" button question
Can you give us your code, or better, a small sample survey?

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

Please Log in to join the conversation.

More
2 years 9 months ago #111446 by jmdsbussrv
jmdsbussrv replied the topic: Another disable "next" button question
Hi, Tony, thanks for jumping on this. I apologize for my tardiness in reply, but I had clients with emergency jobs that needed to be done asap.

I've tried to manipulate a few of the codes you've posted for others in the past, but can't seem to get any to work. I am guessing it is probably something to do with my syntax.

Here is the last code I worked with, but gave up after hacking at it for some time. The code may or may not be the original as I do not remember at this point how I left it:

<script type="text/javascript" charset="utf-8">
$(document).ready(function() {

// Initially disable the Next/Submit button
$('button[type="submit"]').attr('disabled', 'disabled').addClass('ui-state-disabled');

// Listeners on Yes/No radios to toggle the Next/Submit button
$('#question1711 input.text[value="1"]').click(function(){
$('button[type="submit"]').attr('disabled', '').removeClass('ui-state-disabled');
});
$('#question1711 input.text[value=0]').click(function(){
$('button[type="submit"]').attr('disabled', 'disabled').addClass('ui-state-disabled');
});

});
</script>



Here is a link to a TEST survey that shows what we are trying to do.

http://yoursocialmediaanalysis.com/B2BAnalysis/index.php?sid=76727&lang=en

I know there might be an easier way to accomplish this, but I hate not being able to finish something when I know there's an easy answer to make it work.

The first two text input fields are compared to the next two "hidden" fields which default to the desired answers.

The fifth equation shows either 0 or 1, the 1 showing when all fields match.

The final "question" equation is designed to disable or enable the "Next" button based upon whether the previous equation is either 0 or 1 respectively. This is the one I am trying to implement the j code for.

Thanks in advance for any help you may offer.

Please Log in to join the conversation.

More
2 years 9 months ago #111452 by tpartner
tpartner replied the topic: Another disable "next" button question
Well, I see a bunch of problems...
  1. Your question IDs are wrong - I see no #question1711 in that survey
  2. You are using an older LS version so the selectors for the Next button are wrong - $('button[type="submit"]') should be $('input[type="submit"]')
  3. You have listeners on non-existent elements - there is no text input with a value attribute of "1" or "0"
  4. I don't see any listeners on the actual text inputs - these would require something like a keyup function
  5. I don't see any elements to compare the text inputs to
  6. You will not be able to use a dynamic listener on an equation question - there is no way to detect dynamic changes in those


.

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

Please Log in to join the conversation.

More
2 years 9 months ago #111456 by jmdsbussrv
jmdsbussrv replied the topic: Another disable "next" button question
Wow, OK, thanks, Tony.

The problem is that I think I undid all my changes and left the original code I copied before I stopped, in order that I would be starting with the original copy again when I came back to it.

I will make the changes to this particular instance and also the changes you recommeended and retest. I will post the results upon completion of testing.

Thanks. You're the best.

Please Log in to join the conversation.

More
2 years 9 months ago #111491 by jmdsbussrv
jmdsbussrv replied the topic: Another disable "next" button question
Alright, here we go ...

New code that WORKS, but I need one more thing ....

<script type="text/javascript" charset="utf-8">
$(document).ready(function() {

// Initially disable the Next/Submit button
$('input[type="submit"]').attr('disabled', 'disabled').addClass('ui-state-disabled');
if (1==1) {
$('input[type="submit"]').attr('disabled', '').removeClass('ui-state-disabled');
}
else {
$('input[type="submit"]').attr('disabled', 'disabled').addClass('ui-state-disabled');
}
});
</script>


Using the "if else" statement, if I set the condition to 1==1, the "Next" button is enabled. If I set it to 0==1, then the button is disabled.

So this part works.

The final problem I have is trying to import the value of a question to compare to the "???==1". I've tried listeners, and "nameofquestion", and assigning the value of #question2652 to a variable. Nothing seems to work. I am sure it must be my syntax or something I don't understand.

I have an equation question that generates the "1" or "0" and I also have a radio filter that defaults to the answer given by the equation question. So I can use either of these for import.

Thanks.

Please Log in to join the conversation.

More
2 years 9 months ago #111504 by tpartner
tpartner replied the topic: Another disable "next" button question
Assuming the equation question is loaded before the page renders (is not dynamic) and there is only one equation question on the page, you can do something like this:

var equationValue = $.trim($('div.em_equation').text())
if (equationValue == 1) {
...

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

Please Log in to join the conversation.

More
2 years 4 months ago #116126 by fanepic
fanepic replied the topic: Another disable "next" button question
Hi there

I need a function to disable the next button until all mandatory fields are filled.
Is this possible?

Thanks for your support

Please Log in to join the conversation.

More
2 years 4 months ago #116154 by tpartner
tpartner replied the topic: Another disable "next" button question
Yes it is possible with JavaScript but the details of the script would depend on the question types used and may be fairly complex.

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

Please Log in to join the conversation.

More
2 years 4 months ago #116157 by fanepic
fanepic replied the topic: Another disable "next" button question
Thanks for your reply, I have only radio buttons in my survey.
Do you know how the script would look like?

Thanks for your help

Please Log in to join the conversation.

More
2 years 4 months ago #116159 by tpartner
tpartner replied the topic: Another disable "next" button question
In that case, adding this to the source of one of the questions on every page (group) you want affected should work.

<script type="text/javascript" charset="utf-8">	
	$(document).ready(function() {
 
		$('#movenextbtn, #movesubmitbtn').hide();
 
		$('input.radio').bind('click', function(e) {
			if($('input.radio:checked').length == $('.radio-list').length) {
				$('#movenextbtn, #movesubmitbtn').show();
			}
		});
 
    });
</script>


Or, if you want to affect every page (group) in the survey, add this to the end of template.js:

$(document).ready(function() {
 
	$('#movenextbtn, #movesubmitbtn').hide();
 
	$('input.radio').bind('click', function(e) {
		if($('input.radio:checked').length == $('.radio-list').length) {
			$('#movenextbtn, #movesubmitbtn').show();
		}
	});
 
});

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The following user(s) said Thank You: fanepic

Please Log in to join the conversation.

More
2 years 4 months ago #116164 by fanepic
fanepic replied the topic: Another disable "next" button question
Thank you so much this scripts are working:)
The only thing is if you go back the next button is hidding until you change a radio button or press it again. Can i fix that somehow?

Please Log in to join the conversation.

More
2 years 4 months ago #116166 by tpartner
tpartner replied the topic: Another disable "next" button question
Try this:

<script type="text/javascript" charset="utf-8">	
	$(document).ready(function() {
 
		$('#movenextbtn, #movesubmitbtn').hide();
		if($('input.radio:checked').length == $('.radio-list').length) {
			$('#movenextbtn, #movesubmitbtn').show();
		}
 
		$('input.radio').bind('click', function(e) {
			if($('input.radio:checked').length == $('.radio-list').length) {
				$('#movenextbtn, #movesubmitbtn').show();
			}
		});
 
    });
</script>

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The following user(s) said Thank You: fanepic

Please Log in to join the conversation.

More
2 years 4 months ago #116168 by fanepic
fanepic replied the topic: Another disable "next" button question
Awesome this works:) thanks for that
The only thing that doesn't work is that if a question is hidden by a condition it needs to be pressed as well for showing the next button. Is there a way to apply it just on the visible buttons?

Please Log in to join the conversation.

More
2 years 4 months ago #116171 by tpartner
tpartner replied the topic: Another disable "next" button question
As I said, this has the potential to get quite complicated. Have a look at the jQuery :visible selector - api.jquery.com/visible-selector/ .

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

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now