CODEWITHSUNDEEP
phptemplatescontent-management-systemsilverstripe
Dallby
Dallby

Reputation: 596

Silverstripe: Custom Form Template - Validation Issue

I've created a front end form in Silverstripe. It works in the sense that it records data, and if there are any errors, it redirects back and doesn't save the data. However the problem I'm facing is the validation messages aren't displaying correctly. When I display the form on the front end using the $Form variable, the validation and everything works fine. What I want to do is control the layout of the form using <% control Form %>. This is because of how the form has been designed.

Here is my code:

(Template.ss)

<% control Form %>
    <form class="wrap" $FormAttributes>
        <% 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 %>
            <fieldset>
                <div class="member-details col lg-mobile-12 tablet-6 sm-desktop-6 md-desktop-6">
                    <% if ModTest == 'false' %>
                        <div class="field wrap">
                            <% control $Fields.dataFieldByName(ClientName) %>
                                <label class="title">$Title</label>$Field
                                    <% end_control %>
                                </div>
                            <% end_if %>
                            <div class="field wrap">
                                <% control $Fields.dataFieldByName(FirstName) %>
                                    <label class="title">$Title</label>$Field
                                <% end_control %>
                            </div>
                            <div class="field wrap">
                                <% control $Fields.dataFieldByName(Surname) %>
                                    <label class="title">$Title</label>$Field
                                <% end_control %>
                            </div>
                            <% if $Fields.dataFieldByName(Address) %>
                                <div class="field address wrap">
                                    <% control $Fields.dataFieldByName(Address) %>
                                        <label class="title">$Title</label>
                                    <% end_control %>
                                    <div class="address-fields wrap">
                                        $Fields.dataFieldByName(Address)
                                        $Fields.dataFieldByName(Suburb)
                                        $Fields.dataFieldByName(State)
                                        $Fields.dataFieldByName(PostCode)
                                    </div>
                                </div>
                            <% end_if %>

                            <% control $Fields.dataFieldByName(Phone) %>
                                <div class="field wrap">
                                        <label class="title">$Title</label>$Field
                                </div>
                            <% end_control %>

                            <% control $Fields.dataFieldByName(Email) %>
                                <div id="$HolderID" class="field wrap <% if $extraClass %> $extraClass<% end_if %>">
                                    <label class="title" for="$ID">$Title</label>
                                    $Field
                                    <% if $Message %><span class="message $MessageType">$Message</span><% end_if %>
                                </div>
                            <% end_control %>

                        </div>
                        <div class="password col lg-mobile-12 tablet-6 sm-desktop-6 md-desktop-6">
                            <div class="field confirmedpassword">
                                $Fields.dataFieldByName(Password)                   
                            </div>
                        </div>
                        $Fields.dataFieldByName(SecurityID)
                    </fieldset>
                    <div class="col lg-mobile-12 tablet-12 sm-desktop-12 md-desktop-12">
                        <% if $Actions %>
                        <div class="Actions">
                            <% loop $Actions %>
                                $Field
                            <% end_loop %>
                        </div>
                        <% end_if %>
                    </div>
                </form>
            <% end_control %>

Upvotes: 1

Views: 485

Answers (2)

bummzack
bummzack

Reputation: 5875

Writing all your form markup in the template – as you did – pretty much defeats the purpose of form-rendering and templates. It's also highly inflexible because you'd have to add newly added fields inside your template instead of just adding them to the form.

Personally, I'd make use of CompositeField to group your fields (eg. the ones that wrap multiple fields) and use setTemplate on fields that require a custom template.

I think you should be able to achieve an output pretty similar to your template with custom templates and composite-fields. So that you can then just drop $Form in your template and be happy…

Upvotes: 1

Stephen
Stephen

Reputation: 146

To get messages on a per-field level you need to work with each of the field objects.

<% with $Fields.dataFieldByName(Name) %>
    <div>
      <label>Name</label>
      <input name="Name" type="text" id="name" placeholder="Name" required>
      <% if $Message %><span>$Message</span><% end_if %>
    </div>
<% end_with %>

Adding a $Debug inside the with will list out what's available in the field, which is useful for adding css id's and other CMS controlled text.

Upvotes: 1

Related Questions