by TheCrow January 5th 2017, 10:19 pm
Fields Creation:
Field 1:Type: A list
Name: Question 1 (or whatever you want)
Description: Anything you want
URL icon: if you want you can add one
Necessarily filled? Yes
Display: Choose where you want them to show (i recommend only Profiles)
Display Type: Text
Who can modify the profile field value? Moderators (so members can't edit this) This way you can ask members these questions and you can edit these fields on their profiles or do it as you wish.
Display this field for users that are at least: Members
Separator: Back to the line
Now as list you can add the 4 potential answers. Let's say those answers are:
- Answer 1
- Answer 2
- Answer 3
- Answer 4
Now you have to create a second field with the exact same information.
For the
third field you create it like this:
Type: Text Zone
Name: Test Result (or whatever you want)
Description: Anything you want
URL icon: if you want you can add one
Necessarily filled? No
Display: Choose where you want them to show (i recommend only Profiles)
Display Type: Text
Who can modify the profile field value? None because this field will not be touched.
Display this field for users that are at least: Members
Separator: Back to the line
and to the
Text Zone as the
default text you have to add this:
- Code:
[table id="resultTest"][tr][td][/td][/tr][/table]
Javascript:
Now once you add the below javascript you need to make sure you add the correct profile field ids. Here's the javascript code:
Name: Anything
Placement: In all the pages
Code: - Code:
//Code by Luffy
$(document).ready(function(){
var a=$('dl#field_id1 .field_uneditable'), // id1
b=$('dl#field_id2 .field_uneditable'); // id2
//Question 1 Answers
$('dl#field_id1 .field_uneditable:contains(Answer 1)').addClass('2ptsA'); // id1
$('dl#field_id1 .field_uneditable:contains(Answer 2)').addClass('3ptsA'); // id1
$('dl#field_id1 .field_uneditable:contains(Answer 3)').addClass('4ptsA'); // id1
$('dl#field_id1 .field_uneditable:contains(Answer 4)').addClass('5ptsA'); // id1
//Question 2 Answers
$('dl#field_id2 .field_uneditable:contains(Answer 1)').addClass('2ptsB'); // id2
$('dl#field_id2 .field_uneditable:contains(Answer 2)').addClass('3ptsB'); // id2
$('dl#field_id2 .field_uneditable:contains(Answer 3)').addClass('4ptsB'); // id2
$('dl#field_id2 .field_uneditable:contains(Answer 4)').addClass('5ptsB'); // id2
if ( a.hasClass('2ptsA') && b.hasClass('2ptsB') || a.hasClass('2ptsA') && b.hasClass('3ptsB') || a.hasClass('3ptsA') && b.hasClass('2ptsB') ) {
$('table#resultTest').addClass('groupA');
} else if ( a.hasClass('3ptsA') && b.hasClass('3ptsB') || a.hasClass('2ptsA') && b.hasClass('4ptsB') || a.hasClass('4ptsA') && b.hasClass('2ptsB') || a.hasClass('4ptsA') && b.hasClass('3ptsB') || a.hasClass('3ptsA') && b.hasClass('4ptsB') || a.hasClass('2ptsA') && b.hasClass('5ptsB') || a.hasClass('5ptsA') && b.hasClass('2ptsB') ) {
$('table#resultTest').addClass('groupB')
} else if ( a.hasClass('4ptsA') && b.hasClass('4ptsB') || a.hasClass('3ptsA') && b.hasClass('5ptsB') || a.hasClass('5ptsA') && b.hasClass('3ptsB') || a.hasClass('4ptsA') && b.hasClass('5ptsB') || a.hasClass('5ptsA') && b.hasClass('4ptsB') ) {
$('table#resultTest').addClass('groupC')
} else if ( a.hasClass('5ptsA') && b.hasClass('5ptsB') ) {
$('table#resultTest').addClass('groupD')
}
});
Modifications:Now as you can see in the javascript you can see the possible answers of the 2 fields. Now depending on the answers you added, please change the text in the parenthesis.
Also i have added some id1 and id2 comments in there to locate the parts where the 2 fields are. Now to indicate those fields ids go to your profile, find the question fields, right click > inspect element and check what id they are under:
- Example:
After you do those modifications, click Submit.
CSS
Lastly you have to add this CSS:
- Code:
table#resultTest.groupA:before{content:'Group A'}
table#resultTest.groupB:before{content:'Group B'}
table#resultTest.groupC:before{content:'Group C'}
table#resultTest.groupD:before{content:'Group D'}
and change the group names as you want.