Welcome to the LimeSurvey Community Forum

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

Question borders and alignment

  • AntPIC
  • AntPIC's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
7 months 3 weeks ago #249981 by AntPIC
Question borders and alignment was created by AntPIC
LimeSurvey Cloud
Versione 3.28.66
==================
I have 
1. multi short text (nome e cognome)
1. short text with validation (email)
1. short text with validation (codice fiscale)
1. drop down
How Can I Allign and hide the borders?

I put this code in my custom.css
.no-question { border-top:transparent none; }
.no-question .question-title-container { display:none; }
.no-question .question-valid-container { display:none; }
.no-question .answer-container {
    padding-top: 0em;
    padding-bottom: 0em;

.no-bottom { border-bottom:transparent none;margin-bottom:0; }
.no-bottom .answer-container {
    padding-bottom: 0em;

and another code

@media only screen and (min-width: 768px) {
 
  .inline-answers-question .question-title-container.col-xs-12,
  .inline-answers-question .question-valid-container.col-xs-12,
  .inline-answers-question .answer-container.col-xs-12 {
    width: auto;
  }
 
  .inline-answers-question .question-valid-container,
  .inline-answers-question .answer-container {
    padding-top: 1em;
  }
 
  .inline-answers-question .answer-container > div {
    padding-top: 0;
  }
 
  .inline-answers-question .answer-container .ls-answers {
    padding-top: 0;
  }
 
  .inline-answers-question .answer-container .answer-item {
    display: block;
    float: left;
    clear: none;
    margin-bottom: 0;
  }
}

Please Log in to join the conversation.

  • AntPIC
  • AntPIC's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
7 months 3 weeks ago #249984 by AntPIC
Replied by AntPIC on topic Question borders and alignment
News
I put 
1. multiple short text (nome e cognome)
1. mutiple short text (one subquestion) with validation (email)
1. mutiple short text (one subquestion) with validation (codice fiscale)

now my problem is to align the two drop-down question

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
7 months 3 weeks ago #249988 by Joffm
Replied by Joffm on topic Question borders and alignment
Well,
just wanted to tell you that yyou should use the same question type "multiple short text"

And I do not see any issue with (of course you may adapt)
Code:
.no-question{border-top:0;}
.no-question .question-title-container{display:none;}
.no-question .question-valid-container{display:none;}
.no-bottom{border-bottom:0;margin-bottom:0;}
.no-question .answer-container {
    padding-top: 0em;
    padding-bottom: 0.5em;
}
.no-bottom .answer-container {
    padding-bottom: 0em;
}

and an additional (to align and to narrow the spaces)
Code:
<style type="text/css">
label.control-label {
    text-align: left !important;
}
ul.ls-answers {
    margin-bottom: 0em;
}
  .ls-answers {
    padding-bottom: 0;
}
</style>

To get
 

And you also should use the same question type for your drop-downs
Here the script
Code:
<script type="text/javascript" charset="utf-8">
    $(document).on('ready pjax:complete',function()    {
        var qID = {QID};        
        var inputNum = 1;  // Adapt to your needs
 
        // Define the select element (dropdown)
        var prov1 = '<select id="prov1" class="form-control">\
                        <option value="">--Please, select--</option>\
                        <option value="1">Option 1</option>\
                        <option value="2">Option 2</option>\
                        <option value="3">Option 3</option>\
                        <option value="4">Option 4</option>\
                    </select>';
         // Hide the text input
        $('#question'+qID+' .question-item:eq('+(inputNum-1)+') input[type="text"]').hide();
 
        // Insert the select elements
        if($('#question'+qID+' .question-item:eq('+(inputNum-1)+') select').length == 0) {
            $('#question'+qID+' .question-item:eq('+(inputNum-1)+') input[type="text"]').before(prov1);
        }        
         
        // Initially select an option if the question has already been answered
        $('#question'+qID+' select').each(function(i) {
            if($.trim($(this).next('input[type="text"]').val()) != '') {
                $(this).val($.trim($(this).next('input[type="text"]').val()));
            }
        });
 
        // Listener on the dropdowns - insert selected values into hidden text input
        $('#question'+qID+' select').change(function() {
            var thisInput = $(this).next('input[type="text"]');
            $(thisInput).val($(this).val());
            checkconditions($(thisInput).attr('value'), $(thisInput).attr('name'), 'text');
        });
 
        // Some styles
        $('#question'+qID+' select').css({
        'margin':'0.3em 0 0 0'
        });
    });
</script>
 

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

Please Log in to join the conversation.

  • AntPIC
  • AntPIC's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
7 months 3 weeks ago #250001 by AntPIC
Replied by AntPIC on topic Question borders and alignment
Thank you, 
but i have some problem in the code (i paste thhe code in the custom.js)

These are the error message
       

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
7 months 3 weeks ago #250009 by Joffm
Replied by Joffm on topic Question borders and alignment
1. 
if you put it into "custom.js" you must not surround with <script></script>
Therefore the error sign.

2.
What makes you put it into "custom.js".
As you see the script is customized for this one question.
Such scripts you should put into the source code of the question.

3.
The rest are just warnings. 
 

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

Please Log in to join the conversation.

  • AntPIC
  • AntPIC's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
7 months 3 weeks ago #250022 by AntPIC
Replied by AntPIC on topic Question borders and alignment
Just a little patience
if i put the code and save

after i see only this

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
7 months 3 weeks ago #250026 by Joffm
Replied by Joffm on topic Question borders and alignment
Sorry, you seem to have no rights to insert javascript.
Though you said you are working with a installation that is hosted at LimeSurvey GmbH.
Here you have these rights.
Or is the installation something else?

Insert a simple test 
Code:
<script type="text/javascript" charset="utf-8">
  $(document).on('ready pjax:complete',function() {
     alert("Hello, javascript speaking");
  });
If it pops up, fine, otherwise you have to find a different approach.


And why do you change things?
In the original script there is
var qID = {QID}; 
This has not to be changed as {QID} always contains the actual questionID

And why did you change
var prov1 = '<select id="prov1" class="form-control">\
to
var Prova = '<select id="Prova" class="form-control">
but did not change it here
$('#question'+qID+' .question-item:eq('+(inputNum-1)+') input[type="text"]').before(prov1);

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

Please Log in to join the conversation.

  • AntPIC
  • AntPIC's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
7 months 3 weeks ago #250029 by AntPIC
Replied by AntPIC on topic Question borders and alignment
I put the code
 
and i see this
 

I don't know why.
Last question (if java works): What should I change in the code? What values should I customize?so if i solve with java i can use the code
Thank you


 

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
7 months 3 weeks ago #250034 by Joffm
Replied by Joffm on topic Question borders and alignment
Sorry, my mistake.
Of course you have to close the text script with </script>

I thought you had noticed that. All scripts here are surrounded by <script></script> tags.

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

Please Log in to join the conversation.

  • AntPIC
  • AntPIC's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
7 months 3 weeks ago #250039 by AntPIC
Replied by AntPIC on topic Question borders and alignment
Thank, but never changed
I don't know why.
Just a question for use the code (if java works): What should I change in the code? What values should I customize?so if i solve with java i can use the code
   

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
7 months 3 weeks ago #250046 by Joffm
Replied by Joffm on topic Question borders and alignment
So you did not see this (or something similar, depends on  browser)?
 
Then you can't use javascript.

By the way: 
Here the sample survey I showed.
 

File Attachment:

File Name: limesurvey...1826.lss
File Size:25 KB


Import and run.
If it doesn't show the drop-down in the last subquestion insted some text of the script in the question text, bad luck.
Consider something else.

Joffm

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

Please Log in to join the conversation.

Lime-years ahead

Online-surveys for every purse and purpose