Dollar sign prefix appears above input box

More
7 months 2 weeks ago #162039 by LeftyMaus
LeftyMaus created the topic: Dollar sign prefix appears above input box
Hi,
I would like to bring an older survey into the new default template, but the Numeric question does not display properly. Instead of...
$ [numinputbox]
...the survey displays:
$
[numinputbox]

I tried to correct the behavior by manually adding
.numeric {display: inline;}
to the end of template.css, but that does not seem to help.

I thought it was related to my old survey, but it also happens when I create a brand new survey and using the default settings. To recreate the problem, open Limesurvey (I am running Limesurvey v2.72.6).
  1. Click "Create a new survey"
  2. enable the "Sample question:" setting in order to add a group and sample question to the new survey
  3. Ensure that the Template is set to "Default"
  4. Click "save and close"
  5. Edit the default question
  6. Change question type to Numerical Input
  7. Click "Advanced settings"
  8. enter $ into the field "Answer prefix (en): "
  9. Again click "save and close"
  10. Then preview the question

See attached image, *.lss file, and default template. The problem shows in Chrome and Firefox.

For what its worth, the older version that I am migrating from is v2.56.1.
Attachments:

Please Log in or Create an account to join the conversation.

More
7 months 2 weeks ago #162056 by tpartner
tpartner replied the topic: Dollar sign prefix appears above input box
This appears to be a bug, please report it - www.limesurvey.org/community/bug-tracker .

In the meantime, give the question a CSS class "with-prefix" and add something like this to the end of template.css:

.numeric.with-prefix input.text {
	display: inline-block;
	width: auto; 
}

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

Please Log in or Create an account to join the conversation.

More
7 months 2 weeks ago #162061 by LeftyMaus
LeftyMaus replied the topic: Dollar sign prefix appears above input box
I don't know how to give a particular question a CSS class, but I was able to identify a CSS handle. By looking over the source code of the survey preview, I identified all <p> of the class "withprefix" that are contained within <div> of the class "answer". In other words:
div.answer p.withprefix

Rather than constantly fiddling with the template.css file, I implemented the css formatting change using java at runtime. By injecting this code directly into the "Question:" field of question code Q00, this helped me visualize what was going wrong by highlight the problem in red.
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
		// highlight the problem in red
		$( 'div.answer p.withprefix' ).css({
			'color': 'red',
			'background-color': 'rgba(255,0,0,0.3)'
		});
	});
</script>

Using this method, I adopted your suggestion, but removed ".with-prefix" from the phrase '.numeric.with-prefix input.text'. It seems to have fixed the problem. But I'll have to spend a bit more time troubleshooting, so that I'm confident I haven't caused other trouble by making the handle too broad.
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
		// suggested fix by tpartner
		// dropped ".with-prefix" from the phrase '.numeric.with-prefix input.text'
		$( '.numeric input.text' ).css({
			'display': 'inline-block',
			'width': 'auto'
		});
	});
</script>

I've refreshed the screenshot to show the highliting while in effect.
Attachments:

Please Log in or Create an account to join the conversation.

More
7 months 2 weeks ago #162062 by LeftyMaus
LeftyMaus replied the topic: Dollar sign prefix appears above input box
I'm happy to submit a bug, but it won't allow me to log in. Instead I get the disabled/blocked/incorrect error. Its obvious that I'm able to log in to the forum, but the bug tracking system doesn't seem to recognize the same login credentials.
Attachments:

Please Log in or Create an account to join the conversation.

More
7 months 2 weeks ago #162069 by tpartner
tpartner replied the topic: Dollar sign prefix appears above input box

I don't know how to give a particular question a CSS class

It is a question setting.


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

Please Log in or Create an account to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!