Photoshop Question posted in
The official user guide can be found here.

Silverstripe better form looking on templates – Photoshop

I have a designed template on photoshop from a client. My interrogation… When I saw the template is: Can I put 2 fields side-by-side? I want to have f_firstname and f_lastname on one row… Is there anyway to inject tags or piece of code with classes like ex: div=”column1of2″ $field_here close div to have a 2 columns for 2 fields?

Actually, code generate each fields are on separates rows. That’s not very pretty. Possible?

I have this code :

private static $allowed_actions = array(
    'FormInfolettre'
);

public function FormInfolettre() {
    $fields = new FieldList(
        EmailField::create('f_email', 'Votre courriel'),
        TextField::create('f_firstname', 'Votre prénom'),
        TextField::create('f_lastname', 'Votre nom'),
        TextField::create('f_message', 'Votremessage'),
);

    $actions = new FieldList(
        FormAction::create("Soumettre")->setTitle("Soumettre")
    );

    $required = new RequiredFields(
        array(
            'f_email',
            'f_firstname',
            'f_lastname',
            'f_message',

        ));

    $form = new Form($this, 'FormInfolettre', $fields, $actions, $required);

    return $form;
}
Tags:

3

Answers


  1. 0

    I believe this can be done in the new versions by adding your fields to groups then adding a class and CSS for those classes, one group that is left aligned and the other right aligned.

    Alternatively, I forked an older version of Userforms a while back to accomplish this.
    https://github.com/helenclarko/silverstripe-userforms

    Login or Signup to reply.
  2. 0

    You can create FieldGroups for the container div and add extra css classes to the fields like

    $fields = FieldList::create();

$firstName = TextField::create('FirstName','First Name')->addExtraClass('small-8 medium-4 large-5 columns');
$surname = TextField::create('Surname','Surname')->addExtraClass('small-12 medium-5 large-5 columns');

$nameGroup = FieldGroup::create($firstName, $surname);

$fields->push($nameGroup);
    Login or Signup to reply.
  3. 0

    I’ve always liked using a SilverStripe template for the forms. To do this, we need to use the forTemplate function to define the template. With the code below, we are setting the template name to MyForm

    <?php

class MyForm extends Form {
    function __construct($controller, $name) {
        ...
    }

    function forTemplate() {
        return $this->renderWith(array(
            $this->class
        ));
    }
}

    We create a MyForm.ss template in themename/templates/Includes

    A form layout would be something like: 

    <form $FormAttributes>

<% loop $Fields %>
  <% if $Message %><p style="color:red; padding: 0 0 3px 0; margin:0">$Message</p><% end_if %>
<% end_loop %>

<% if $Message %>
  <p id="{$FormName}_error" class="message $MessageType">$Message</p>
<% else %>
  <p id="{$FormName}_error" class="message $MessageType" style="display: none"></p>
<% end_if %>

$Fields.FieldByName(SecurityID)

<div class="row">
  <div class="large-6 medium-6 small-12 columns">
    $Fields.FieldByName(FirstName)
    <small class="error">Please enter your first name</small>
  </div>

  <div class="large-6 medium-6 small-12 columns">
    $Fields.FieldByName(Surname)
    <small class="error">Please enter your surname</small>
  </div>
</div>

<div class="typographyr">
  <button class="button">Submit</button>
</div>

</form>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search