View Issue Details

IDProjectCategoryView StatusLast Update
11725Feature requests[All Projects] Survey editingpublic2018-04-06 11:48
ReporterDenisChenu Assigned ToDenisChenu  
PrioritynoneSeverityfeature 
Status closedResolutionfixed 
Product Version 
Target VersionFixed in Version3.0 
Summary11725: Multiple numeric with slider : columns width
Description

In Multiple numerci with slider : actual solution use 12/12 for columlns, but before we use some 50/50.

Think have a 6/6 is OK, but then with siffix and prefix : unsure where we need to put the prefix/suffix width inside label or inpout group

Steps To Reproduce

See the 2 screenshot : managed with different suffix/prefix system (using separator)

Additional Information

To add or not the suffix prefix : we can use a global system withPrefix /withSuffix for whole sub-questions (like we do for right answer in array question), but can be fixed after.

The separator can be really cool with no slider numeric question too (and easy to add)

Tagsanswers_html

Relationships

related to 11724 closedDenisChenu Usage of input-group input-group-addon 
related to 11726 closedDenisChenu Default column width and table header width 

Activities

DenisChenu

DenisChenu

2016-09-29 00:26

developer  

inInputWidth.png (41,540 bytes)
inInputWidth.png (41,540 bytes)
DenisChenu

DenisChenu

2016-09-29 00:28

developer  

insideInputWidth.png (42,072 bytes)
insideInputWidth.png (42,072 bytes)
DenisChenu

DenisChenu

2016-09-29 00:29

developer   ~41021

I'm unusre too for the "reset" text : did we must show it or not ? If not : it's clear or not with an icon ?

There are some other bug with reset (must reset to the default place,not to null)

DenisChenu

DenisChenu

2016-09-29 00:30

developer   ~41022

Ps : i test too with input-group-add-on ... lol ...

jelo

jelo

2016-09-29 01:29

partner   ~41024

In both screenshots the question-text is too far away from the labels/sliders.
The text and the slider should be more "compact" and the optical middle should ignore the height of the handle with the number.

"Reset" button should contain text.

To give an example for "compact" slider question I attach a slider question from a different survey system. The handle with a number is there displayed when clicking the handle.



sliderexample01.jpg (53,914 bytes)
sliderexample01.jpg (53,914 bytes)
DenisChenu

DenisChenu

2016-09-29 08:15

developer   ~41025

For "compact or not" :
Facts

  • we can bever know the size of whole answer part
  • If you have different multiple numeric question : think it best if you have same width for each column (else we can use display: table and leave all automatic)
  • We made the choice to use bootstrap, and bootsrap don't have a clean "display:table" system => if we use one : we break bootsrap.
  • You can set the width of answer column : easy to make choice of put 20% by default ( ~ col-3 i rhink)
DenisChenu

DenisChenu

2016-09-30 19:02

developer   ~41050

For display:table(-row|cell|)

See http://www.onenaught.com/posts/201/use-css-displaytable-for-layout or http://www.senktec.com/2014/01/using-css-display-table-cell-for-columns/

DenisChenu

DenisChenu

2016-10-01 10:46

developer   ~41052

I made an error : boostrap have display:table display:table-cell :

display:table in input-group
display:table-cell for .input-group .form-control, .input-group-addon, .input-group-btn

Just a lack of table-cell with less css than addon , somethink like this

.input-group-extra {
display: table-cell;
vertical-align: middle;
width: 1%;
padding: x y;
}

DenisChenu

DenisChenu

2016-10-04 09:08

developer   ~41064

Last edited: 2016-10-04 09:11

View 2 revisions

We can use ls-input-group-extra

BUT : if user want a multilinbe part here : it's break anything

See :http://testing.sondages.pro/answershtml/alternate/awesome/index.php/69285?lang=fr&encode= for a quick example.

It canb make something near the screen shot, but something breaking with : multiline suffix-preffix / img in suffix-preffix

3 solutions :

  • core system think suffix/prefix must be little, and we use ls-input-group-extra for whole line.
  • core system allow anythink in suffix/preffix and then we have a big empty part (can be fixed set "answerwidth".
  • Add an extra attribute (again ....)
Mazi

Mazi

2016-10-04 10:18

partner   ~41069

If possible I'd prefer to use the input-group-addon feature (see https://bugs.limesurvey.org/view.php?id=11724) here as well, especially since for the non-slider "multiple numeric" layout it will be useful as well.

We should not assume that users will make use of complex texts for prefix/suffic including multiple lines.

DenisChenu

DenisChenu

2016-10-04 10:26

developer   ~41075

Yes, we move to the other for this.

Just for confirmation : by DEFAULT : slider + subquestion in same line ?

Mazi

Mazi

2016-10-04 10:40

partner   ~41078

Yes, for common/larger screen resolutions it is helpful to have it in the same line.
For lower resolutions having the subquestion text at the line above would be nice.

DenisChenu

DenisChenu

2016-10-04 11:06

developer   ~41082

Yes sure : http://testing.sondages.pro/answershtml/alternate/awesome/index.php/48422?lang=fr&encode=

Just need a css fix for margin top

Related Changesets

LimeSurvey: answers_html 84ecb886

2016-09-29 09:16:24

DenisChenu

Details Diff
Dev: rework multiple numeric with slider : external js + css
Dev: fix .slider-handle.custom (the included style don't work on last Firefox)
Dev: add input-group-addon on suffix/preffix on multiple text: to be confirmed
Affected Issues
11656, 11724, 11725
mod - application/helpers/qanda_helper.php Diff File
mod - application/views/survey/questions/multiplenumeric/answer.php Diff File
mod - application/views/survey/questions/multiplenumeric/rows/input/answer_row.php Diff File
mod - application/views/survey/questions/multiplenumeric/rows/sliders/answer_row.php Diff File
mod - application/views/survey/questions/multipleshorttext/rows/answer_row_inputtext.php Diff File
mod - application/views/survey/questions/multipleshorttext/rows/answer_row_textarea.php Diff File
mod - scripts/expressions/em_javascript.js Diff File
mod - scripts/numeric-slider.js Diff File
mod - styles-public/numeric-slider.css Diff File
mod - templates/default/config.xml Diff File
rm - templates/default/css/bootstrap-slider-rtl.css Diff File
rm - templates/default/css/bootstrap-slider.css Diff File
mod - templates/default/css/template.css Diff File

LimeSurvey: answers_html 549e005f

2016-09-29 09:18:50

DenisChenu

Details Diff
Dev: remove IE8/9 filter css : think it must not be in core, but in template only ?
Dev: The slider-handle have bg-primary color, with (for modern browser) some gradient
Affected Issues
11725
mod - styles-public/numeric-slider.css Diff File

Issue History

Date Modified Username Field Change
2016-09-29 00:26 DenisChenu New Issue
2016-09-29 00:26 DenisChenu File Added: inInputWidth.png
2016-09-29 00:27 DenisChenu Tag Attached: answers_html
2016-09-29 00:28 DenisChenu File Added: insideInputWidth.png
2016-09-29 00:29 DenisChenu Note Added: 41021
2016-09-29 00:30 DenisChenu Note Added: 41022
2016-09-29 01:29 jelo File Added: sliderexample01.jpg
2016-09-29 01:29 jelo Note Added: 41024
2016-09-29 08:15 DenisChenu Note Added: 41025
2016-09-29 09:26 DenisChenu Changeset attached => LimeSurvey answers_html 84ecb886
2016-09-29 09:26 DenisChenu Changeset attached => LimeSurvey answers_html 549e005f
2016-09-29 09:30 DenisChenu Relationship added related to 11726
2016-09-30 18:59 DenisChenu Project Development => Feature requests
2016-09-30 18:59 DenisChenu Severity @50@ => feature
2016-09-30 18:59 DenisChenu Product Version 2.5x =>
2016-09-30 18:59 DenisChenu Target Version 3.x =>
2016-09-30 19:02 DenisChenu Note Added: 41050
2016-10-01 10:46 DenisChenu Note Added: 41052
2016-10-04 09:08 DenisChenu Note Added: 41064
2016-10-04 09:11 DenisChenu Note Edited: 41064 View Revisions
2016-10-04 10:18 Mazi Note Added: 41069
2016-10-04 10:26 DenisChenu Note Added: 41075
2016-10-04 10:27 DenisChenu Relationship added related to 11724
2016-10-04 10:40 Mazi Note Added: 41078
2016-10-04 11:06 DenisChenu Note Added: 41082
2016-10-04 11:07 DenisChenu Assigned To => DenisChenu
2016-10-04 11:07 DenisChenu Status new => assigned
2016-10-04 11:07 DenisChenu Status assigned => resolved
2016-10-04 11:07 DenisChenu Resolution open => fixed
2016-10-04 11:07 DenisChenu Fixed in Version => 3.0
2018-04-06 11:48 markusfluer Status resolved => closed
2019-11-01 17:25 c_schmitz Category Survey design => Survey editing