Regarding responsive design, what I disliked so far is the behavior of answer tables. On smaller devices (viewports) the tables are often bigger than the viewport, which is not very usable and looks ugly.



Recently I discoverd an intersting solution for this problem:
bootsnipp.com/snippets/featured/no-more-...es-respsonsive-table


So I tried to implement this in into the basic bootstrap template, the result you can see here:



The needed css and js files are here (just insert into the head):


Tested only in FF, on Iphone and Samsung Galaxy.
Mabye this is useful for anyone or can be implemented in future versions of the template.

Wow, that's a really great solution. Tables have always caused problems because of the limited width on smaller devices. This is a pretty good fix!

The no-more-tables is good, but I've already added one line to the css file (just before the final bracket) This stops (at least for the test I ran) the answertext being set to 20%.

Thanks, Tammo - this template is great! I'm currently using it with the no-more-tables solution (thanks, smail!) and most things work, but I can't seem to get the exclusive option to work with multiple choice questions. It ignores that option. Have you seen this behavior? Also, are there any other question types that you know of that do or don't work? I've attached a sample survey.

Hi misterdot,

we know that multiple choice does not work well. We are working on a solution, will probably be available for dowload next week.

We are working now on a free template and a template with some more functionality which will be sold.

Stay tuned...

Have a great weekend!

Tammo ter Hark

misterdot wrote: Thanks, Tammo - this template is great! I'm currently using it with the no-more-tables solution (thanks, smail!) and most things work, but I can't seem to get the exclusive option to work with multiple choice questions. It ignores that option. Have you seen this behavior? Also, are there any other question types that you know of that do or don't work? I've attached a sample survey.

@misterdot, are you sure it really doesn't work or maybe it just doesn't display correctly but still disables items at the background?

Do you see any JavaScript errors?

Did you check results when using this feature? E.g.
- first select option 1 at a multiple choice question
- click next (that already writes the results to the DB)
- check results if option 1 was saved
- go back and click the exclusive option
- click next
- check results again

Maybe it removes the previously saved option 1 from the results?!

Mazi,
You are correct - if I test as you describe, it writes the correct value to the DB, but the display doesn't disable the other choices.

If I select the exclusive option (value=5) and another option (value=1), it writes 5 to the DB. When I go back, the exclusive option is the only one that displays until I uncheck it, then the other choices come back. Selecting non-exclusive options works as expected.

So yes, it seems to just be a JavaScript issue. I don't see any errors on the console (inspect element in Chrome).
Thanks!

My assumption is that this isn't a JS issue but a display issue. The JS seems to disable the other elements correctly, it just doesn't adjust the GUI accordingly.

The exclusive option has been solved now, among many other additions.

The free version has been released, the Premium version will be released early in may!

Stay tuned!

More about the template: toolsforresearch.com/limesurvey-responsive-template

Greetings from Holland,

Tammo ter Hark

Looks great. Thanks for allowing to test your theme. And for the hard work which was done by both of you.

Bugreport (I used your Demo):
"M1 14 Do you know at what date & time you were born?"

When using the date/time question the year is not transferred from the javascript date/time picker. "Y" is pasted into the field instead of 2015.

The picker is displayed when clicking into the field. It is not possible to enter the date/time via the keyboard. The date/time-picker is overlaying that area. Is that an intended behavior. Personal I like to be able to use both ways. Picker via Button at the side or entering via keyboard.


Not sure if missing IE8 support (with the developer hat on I wouldn't support IE8 too) is hurting usage in certain scenarios. Anyone with real life examples where IE8 was crucial for a project? WindowsXP was the OS with IE8 as a last release. The Windows OS flavors under active support are on IE11.

Oops, my mistake, this was a wrong setting in the advanced settings of the date question. I corrected this.

In my browser I can enter the date now. Could you try again and see if it works now?

if not, what browser are you using? We will on it then.

And yes: we will not support IE8, this is ancient. In previous projects supporting IE8 cost us about 20-25% of development time and we cannot afford to spend that time on a declining browser. But if anyone want to support us in doing so, we will.

tammo wrote: In my browser I can enter the date now. Could you try again and see if it works now?

The year is now transferred into the field.

But the picker is still shown when the field is clicked. A entering by keyboard is not possible. Which might relates to available screen estate. I always test browsing in virtual machines with different screen resolutions.

In this screenshot the browser window is 1092px x 856px and the viewport is 1084px x 679px.


Is that intended behavior (datetime-picker as the only input method to ensure correct format)?

OK, thanks. I've put it on our internal issue list.

Maybe this (large) date time picker is not a good candidate for larger screens. But we will see what we can do.

As it turns out, the date/time picker now is styled in a combination of standard jQuery (calendar) together with some of our styling elements (sliders). Because we want users to be able to fill in on tablets/mobile phones, the sliders must be a little larger than normally in jQuery. This results in a larger layout for the complete date/time picker.

For use on mobile phones we advise to split the question in 2: a date question separate from a time question.

We have implemented this in a new version of our test survey, to be found at:
survey.toolsforresearch.com/index.php/123456/lang-en

tammo wrote: Because we want users to be able to fill in on tablets/mobile phones, the sliders must be a little larger than normally in jQuery. This results in a larger layout for the complete date/time picker.

The silder size feels more like looking through an "ease of use" magnifer. I am not totally convinced of mobile first with surveys. These silders size looks "strange" with a desktop browser setup.

I cannot remember using a date/time-picker in a survey, so I will stop commenting on that picker.I am sure you will have a lot more "little" bugs on you todo-list.

I would like to see the gpl version bundled with Limesurvey to ensure better debugging. Not sure if a referral-program for the commercial template can bring the limesurvey project a few bucks too if they bundle it. Just louding thinking from a user.