Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Hide checkbox but keep label

paulfiner
Topic Author
Offline
Premium Member

More

5 years 11 months ago #207529 by paulfiner

Hide checkbox but keep label was created by paulfiner

I'm using the multiple-choice with comments type question to try and show some sub-headings.
I've managed to hide the comment boxes but I'm struggling to hide the checkbox on the first row.
I'm using Limesurvey v2.73

Here's my javascript:

Code:

<script type="text/javascript" charset="utf-8">
	$(document).ready(function() { 
        var thisQuestion = $('#question{QID}');
	// Remove some text inputs
		$('.checkbox-text-item:eq(0) .comment-container', thisQuestion).remove();
                $('input:checkbox:eq(0)', thisQuestion).remove();   <-- This line doesn't work, what do I need?

$('.checkbox-text-item:eq(1) .comment-container', thisQuestion).remove();
$('.checkbox-text-item:eq(2) .comment-container', thisQuestion).remove();
$('.checkbox-text-item:eq(3) .comment-container', thisQuestion).remove();
$('.checkbox-text-item:eq(4) .comment-container', thisQuestion).remove();

Thanks

The topic has been locked.

Joffm
Offline
LimeSurvey Community Team

More

5 years 11 months ago #207531 by Joffm

Replied by Joffm on topic Hide checkbox but keep label

Hi,
I have this:

Code:

<script charset="utf-8" type="text/javascript">
	$(document).ready(function() {
		$( '#question{QID} .question-item:eq(0)').addClass('hide-pseudo-elements').find('input.checkbox').remove();
		$( '#question{QID} .question-item:eq(4)').addClass('hide-pseudo-elements').find('input.checkbox').remove();
		$( '#question{QID} .question-item:eq(7)').addClass('hide-pseudo-elements').find('input.checkbox').remove();
		$( '#question{QID} .question-item:eq(0)').addClass('hide-pseudo-elements').find('.comment-container').remove();
		$( '#question{QID} .question-item:eq(4)').addClass('hide-pseudo-elements').find('.comment-container').remove();
		$( '#question{QID} .question-item:eq(7)').addClass('hide-pseudo-elements').find('.comment-container').remove();

	});
</script>

Code:

<style type="text/css">.hide-pseudo-elements label::before,
.hide-pseudo-elements label::after {
	display: none;
}
 
.hide-pseudo-elements .label-text {
	margin-left: -20px;
}
</style>

Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

5 years 11 months ago #207532 by tpartner

Replied by tpartner on topic Hide checkbox but keep label

The problem is that the labels have pseudo-elements for the checkboxes so you also need to remove those:

Code:

<script type="text/javascript" charset="utf-8">
	$(document).ready(function() { 
        var thisQuestion = $('#question{QID}');
		
		// Remove a checkbox
		$('input:checkbox:eq(0)', thisQuestion).remove();
		$('td.checkbox:eq(0)', thisQuestion).removeClass('checkbox');
		
		// Remove some text inputs
		$('.checkbox-text-item:eq(0) .comment-container', thisQuestion).remove(); 
		$('.checkbox-text-item:eq(1) .comment-container', thisQuestion).remove();
		$('.checkbox-text-item:eq(2) .comment-container', thisQuestion).remove();
		$('.checkbox-text-item:eq(3) .comment-container', thisQuestion).remove();
		$('.checkbox-text-item:eq(4) .comment-container', thisQuestion).remove();
	});
</script>

Having said that, there is a ton of garbage HTML in that version so I think you would be better off inserting new table rows as the sub-headers:

Code:

<script type="text/javascript" charset="utf-8">
	$(document).ready(function() { 
        var thisQuestion = $('#question{QID}');
		// Remove some text inputs
		$('.checkbox-text-item:eq(0) .comment-container', thisQuestion).remove();
		$('.checkbox-text-item:eq(1) .comment-container', thisQuestion).remove();
		$('.checkbox-text-item:eq(2) .comment-container', thisQuestion).remove();
		$('.checkbox-text-item:eq(3) .comment-container', thisQuestion).remove();
		
		// Insert sub-headings
		$('tr.answer-item:eq(0)', thisQuestion).before('<tr class="inserted-sub-heading"><th colspan=2>Sub-heading 1</th></tr>');
		$('tr.answer-item:eq(3)', thisQuestion).before('<tr class="inserted-sub-heading"><th colspan=2>Sub-heading 2</th></tr>');
	});
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...1714.lss
File Size:17.52 KB

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

The topic has been locked.

paulfiner
Topic Author
Offline
Premium Member

More

5 years 11 months ago #207534 by paulfiner

Replied by paulfiner on topic Hide checkbox but keep label

Thanks Tony and Joffm. I went with your last suggestion Tony and it seems to be working fine. I've set up a new server with the latest V3 so I'll slowly be transitioning over to it.

Cheers,
Paul

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

5 years 11 months ago - 5 years 11 months ago #207536 by tpartner

Replied by tpartner on topic Hide checkbox but keep label

In 3.x, you will need to use something like this:

Code:

<script type="text/javascript" charset="utf-8">
	$(document).ready(function() { 
        var thisQuestion = $('#question{QID}');
		// Remove some text inputs
		$('.checkbox-text-item:eq(0) .comment-item', thisQuestion).remove();
		$('.checkbox-text-item:eq(1) .comment-item', thisQuestion).remove();
		$('.checkbox-text-item:eq(2) .comment-item', thisQuestion).remove();
		$('.checkbox-text-item:eq(3) .comment-item', thisQuestion).remove();
		
		// Insert sub-headings
		$('.checkbox-text-item:eq(0)', thisQuestion).before('<li class="inserted-sub-heading">Sub-heading 1</li>');
		$('.checkbox-text-item:eq(3)', thisQuestion).before('<li class="inserted-sub-heading">Sub-heading 2</li>');
	});
</script>

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

Last edit: 5 years 11 months ago by tpartner.

The topic has been locked.

paulfiner
Topic Author
Offline
Premium Member

More

5 years 11 months ago #207540 by paulfiner

Replied by paulfiner on topic Hide checkbox but keep label

That's great! I have a feeling I'll have a few more of these upgrade queries over the next few weeks!
Cheers

The topic has been locked.

Moderators: tpartner, holch

Powered by Kunena Forum

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans

Get started

Welcome to the LimeSurvey Community Forum

Hide checkbox but keep label

File Attachment:

Lime-years ahead

Legal

About Us

Open Source