Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Form Questions

spread formfields throughout the page


Reply

6 Posts   726 Views

Avatar
theoldlr

24 February 2011 at 3:04am (Last edited: 24 February 2011 3:10am), Community Member, 103 Posts

I've made custom forms in SS before, but the fields have always been grouped together and put into the template all in the same spot with $Form.

I'm making a short quiz that fits into a relatively small space on the page, so unlike a normal form I can't just stick $Form in the template (I think). I was planning on something basically like this:

<div class="container">
<div class="questionslider">
<div class="question1">
[question 1 form field here]
</div>
<div class="question2">
[question 2 form field here]
</div>
</div>
</div>

the questionslider div will be as wide as the sum of widths of the question# divs and there will be controls to move back and forth through the questions (javascript)with the submit button on the last one.

How should I approach this? Hard code the template (feels wrong, but may be right?) Use the multiform module (feels like overkill since the quiz is only on 1 page)?

Advice appreciated! Thanks!

Avatar
Willr

24 February 2011 at 8:28pm Forum Moderator, 5511 Posts

You can make a custom template for a form and implement a setup like that quite easily - http://doc.silverstripe.org/sapphire/en/topics/forms#using-a-custom-template

Avatar
theoldlr

25 February 2011 at 11:30am (Last edited: 25 February 2011 11:36am), Community Member, 103 Posts

Thanks Willr, that was definitely what I was looking for... quick template question to go along with it though...

<% control Fields %>
<div class="slide question{$iteratorPos}">
<div id="question{$iteratorPos}" class="field text">
<label class="left" for="FBForm_question{$iteratorPos}">$title</label>
$Field
</div>
</div>
<% end_control %>

This is how I'm generating the fields, but even if I only have 2 fields it creates question0 - question2 divs. Is the last field considered the Action? Is there a way to control through all the fields but one? heres the constructor:

function __construct($controller, $formName) {
$fields = new FieldSet(
new OptionsetField(
$name='question0',
$title='Test Multiple Choice Question 1:',
$source= array(
'A'=>'Apple',
'B'=>'Boy',
'C'=>'Cat',
'D'=>'Dog'
)
),
new OptionsetField(
$name='question1',
$title='True or False',
$source= array(
'T'=>'True',
'F'=>'False'
)
)
);

$actions = new FieldSet(
new FormAction('submit', 'Get Quiz Score')
);

parent::__construct($controller, $formName, $fields, $actions);
}

Avatar
Willr

25 February 2011 at 12:34pm Forum Moderator, 5511 Posts

Well it is just a DataObjectSet so you could use <% if First %>, <% if Last %>. Actions shouldn't be included in <% control Fields %> (they are under <% control Actions %>).

Avatar
theoldlr

26 February 2011 at 5:53am Community Member, 103 Posts

I'm almost there... I'm having some trouble finding a work around for the limitation of if statements in the templates (Here's hoping for SS 3.0!)...
The additional field I was confused about before was the hidden field for security.

Custom Form class:

class FBForm extends Form{
.
.
.
function isFinished($position, $totalItems){
return($position == ($totalItems-1));
}
}

Template:

<% control Fields %>
<% if Last %>
<label class="left" for="FBForm_question{$iteratorPos}">$title</label>
$Field
<% else %>
<div class="slide question{$iteratorPos}">
<div id="question{$iteratorPos}" class="field text">
<label class="left" for="FBForm_question{$iteratorPos}">$title</label>
$Field
</div>

<!--/* None of this works, I dont think Top.isFinished doesnt seem to be the appropriate way to call 'isFinished'
<% if Top.isFinished(iteratorPos, TotalItems) %>
<% if Actions %>
<div class="Actions">
<% control Actions %>
$Field
<% end_control %>
</div>
<% end_if %> */-->
</div>
<% end_if %>
<% end_control %>

Totally stuck on how to make the above comment work. TIA!

Avatar
Willr

26 February 2011 at 12:24pm Forum Moderator, 5511 Posts

<% if Top.isFinished(iteratorPos, TotalItems) %>

You wouldn't need $Top aas you are already in the Form context and isFinished is in the Form class. You would also have to use a simpler if statement by doing something like

<% if First %>
<% if isFinished(1) %>...

<% else %>
<% isFinished(2) %>..