Formbuilder for bootstrap [Solved]

[douglas1438]

Hi all,

Trying to adapt my form template to work with Bootstrap using the Smarty replace function, however I need to add a form field and button class, so need to combine the two statements but can't work out how.

Code: Select all

{FormBuilder|replace:'id=':'class="form-control" id=' form=myform}
{FormBuilder|replace:'cms_submit':'btn' form=myform}

Thank you

[Dr.CSS]

You should adapt pootstrap to work with formbuilder...

You can use more than one |replace: in a tag, one right after another...

[psy]

You can use more than one |replace: in a tag, one right after another...

Is 100% correct.

You can also write your own FB form template, eg:

Code: Select all

{$fb_form_header}
{if $fb_form_done == 1}
    {* This first section is for displaying submission errors *}
    {if isset($fb_submission_error) && $fb_submission_error}
        <div class="error_message">{$fb_submission_error}</div>
        {if isset($fb_show_submission_errors) && $fb_show_submission_errors}
            <div class="error">
            <ul>
            {foreach from=$fb_submission_error_list item=thisErr}
                <li>{$thisErr}</li>
            {/foreach}
            </ul>
        </div>
        {/if}
    {/if}
{else}
    {* this section is for displaying the form *}
    {* we start with validation errors *}
    {if isset($fb_form_has_validation_errors) && $fb_form_has_validation_errors}
        <div class="error_message">
        <ul>
        {foreach from=$fb_form_validation_errors item=thisErr}
            <li>{$thisErr}</li>
        {/foreach}
        </ul>
        </div>
    {/if}
    {if isset($captcha_error) && $captcha_error}
        <div class="error_message">{$captcha_error}</div>
    {/if}
    
    {$fb_form_start|replace:'form-data"':'form-data" role="form"'}
    <div>{$fb_hidden}</div>


                            <fieldset>
                                <div class="form-group">
                                     <label for="{$actionid}{$name->input_id}">Name</label>
                                     <input class="form-control" type="text" name="{$actionid}{$name->input_id}" id="{$actionid}{$name->input_id}" title="Please enter your name" required="required"/>
                                </div>
                                <div class="form-group">
                                     <label for="{$actionid}{$email->input_id}">E-Mail</label>
                                     <input class="form-control" type="email" name="{$actionid}{$email->input_id}" id="{$actionid}{$email->input_id}" title="Please enter your email address" required="required"/>
                                </div>
                                <div class="form-group">
                                     <label for="{$actionid}{$phone->input_id}">Phone</label><input class="form-control" type="tel" name="{$actionid}{$phone->input_id}" id="{$actionid}{$phone->input_id}" title="Please enter your phone number"/>
                                </div>
                                

                                     

                                     <input class="form-control sweet" type="text" name="{$actionid}{$sweet->input_id}" value="">


                                <div class="form-group">
                                     <label for="{$actionid}{$message->input_id}">Message</label>
                                    <textarea class="form-control" name="{$actionid}{$message->input_id}" id="{$actionid}{$message->input_id}" rows="5" cols="25" >
                                    </textarea><br />
                                </div>
                                <div class="form-group text-right">
                                    <label for="{$actionid}_submit"></label>
                                    <input class="btn btn-lg btn-tlalred" type="submit" name="{$actionid}_submit" id="{$actionid}_submit" value="Send Message" />
                                </div>
                            </fieldset>

{$fb_form_end}
{/if}

for a contact form where 'sweet' is a honeypot field. See https://www.cmscanbesimple.org/blog/hon ... ormbuilder

[douglas1438]

Thank your both for your assistance. Have taken the writing your own template route. Seems a more adaptable solution.

Thanks again,

Chris