ac76a206c1
Role Form should be use on a region of the document that represents a collection of form-associated elements. <div role=”form”></div> GOOD <form role=”form”></form> BAD
288 lines
19 KiB
HTML
288 lines
19 KiB
HTML
{extends file="layout.tpl"}
|
|
|
|
{* Body Class *}
|
|
{block name="body-class"}page-register{/block}
|
|
|
|
{* Breadcrumb *}
|
|
{block name='no-return-functions' append}
|
|
{$breadcrumbs = [['title' => {intl l="Register"}, 'url'=>{url path="/register"}]]}
|
|
{/block}
|
|
|
|
{block name="main-content"}
|
|
<div class="main">
|
|
|
|
<article class="col-main" role="main" aria-labelledby="main-label">
|
|
|
|
<h1 id="main-label" class="page-header">{intl l="Create New Account"}</h1>
|
|
{form name="thelia.front.customer.create"}
|
|
<form id="form-register" class="form-horizontal" action="{url path="/register"}" method="post">
|
|
{form_field form=$form field='success_url'}
|
|
<input type="hidden" name="{$name}" value="{url path="/account"}" /> {* the url the user is redirected to on registration success *}
|
|
{/form_field}
|
|
|
|
{form_field form=$form field='error_message'}
|
|
<input type="hidden" name="{$name}" value="{intl l="missing or invalid data"}" />
|
|
{/form_field}
|
|
{form_hidden_fields form=$form}
|
|
{if $form_error}<div class="alert alert-danger">{$form_error_message}</div>{/if}
|
|
<fieldset id="register-info" class="panel">
|
|
<div class="panel-heading">
|
|
1. {intl l="Personal Informations"}
|
|
</div>
|
|
|
|
<div class="panel-body">
|
|
{form_field form=$form field="title"}
|
|
<div class="form-group group-title{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<select name="{$name}" id="{$label_attr.for}" class="form-control"{if $required} aria-required="true" required{/if}{if !$value || $error} autofocus{/if}>
|
|
<option value="">-- {intl l="Select Title"} --</option>
|
|
{loop type="title" name="country.list"}
|
|
<option value="{$ID}" {if $value == $ID}selected{/if} >{$LONG}</option>
|
|
{/loop}
|
|
</select>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{elseif !$value}
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
{form_field form=$form field="firstname"}
|
|
<div class="form-group group-firstname{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="255" placeholder="{intl l="Placeholder firstname"}" value="{$value}" {if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
{form_field form=$form field="lastname"}
|
|
<div class="form-group group-lastname{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="255" placeholder="{intl l="Placeholder lastname"}" value="{$value}" {if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
{form_field form=$form field="email"}
|
|
<div class="form-group group-email{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
|
|
<div class="control-input">
|
|
<input type="email" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="255" placeholder="{intl l="Placeholder email"}" value="{$smarty.get.email|default:$value}"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
{form_field form=$form field="phone"}
|
|
<div class="form-group group-phone{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="20" placeholder="{intl l="Placeholder phone"}" value="{$value}"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
{form_field form=$form field="cellphone"}
|
|
<div class="form-group group-cellphone{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="20" placeholder="{intl l="Placeholder cellphone"}" value="{$value}"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset id="register-delivery" class="panel">
|
|
<div class="panel-heading">
|
|
2. {intl l="Delivery Informations"}
|
|
</div>
|
|
|
|
<div class="panel-body">
|
|
{form_field form=$form field="company"}
|
|
<div class="form-group group-company{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="255" placeholder="{intl l="Placeholder company"}" value="{$value}"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
|
|
{form_field form=$form field="address1"}
|
|
<div class="form-group group-address1{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="255" placeholder="{intl l="Placeholder address1"}" value="{$value}"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
|
|
{form_field form=$form field="address2"}
|
|
<div class="form-group group-address2{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="255" placeholder="{intl l="Placeholder address2"}" value="{$value}"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
|
|
{form_field form=$form field="city"}
|
|
<div class="form-group group-city{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="255" placeholder="{intl l="Placeholder city"}" value="{$value}"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
|
|
{form_field form=$form field="zipcode"}
|
|
<div class="form-group group-zip{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="text" name="{$name}" id="{$label_attr.for}" class="form-control" maxlength="10" placeholder="{intl l="Placeholder zipcode"}" value="{$value}"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
|
|
{form_field form=$form field="country"}
|
|
<div class="form-group group-country{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<select name="{$name}" id="{$label_attr.for}" class="form-control"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
<option value="">-- {intl l="Select Country"} --</option>
|
|
{loop type="country" name="country.list"}
|
|
<option value="{$ID}"
|
|
{if $value != ""}
|
|
{if $value == $ID}selected{/if}
|
|
{else}
|
|
{if $IS_DEFAULT}selected{/if}
|
|
{/if}
|
|
|
|
>{$TITLE}</option>
|
|
{/loop}
|
|
</select>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
</div>
|
|
</fieldset>
|
|
<fieldset id="register-login" class="panel">
|
|
<div class="panel-heading">
|
|
3. {intl l="Login Information"}
|
|
</div>
|
|
|
|
<div class="panel-body">
|
|
{form_field form=$form field="password"}
|
|
<div class="form-group group-password{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="password" name="{$name}" id="{$label_attr.for}" class="form-control" autocomplete="off"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
|
|
{form_field form=$form field="password_confirm"}
|
|
<div class="form-group group-password_confirm{if $error} has-error{/if}">
|
|
<label class="control-label" for="{$label_attr.for}">{$label}{if $required} <span class="required">*</span>{/if}</label>
|
|
<div class="control-input">
|
|
<input type="password" name="{$name}" id="{$label_attr.for}" class="form-control" autocomplete="off"{if $required} aria-required="true" required{/if}{if !isset($error_focus) && $error} autofocus{/if}>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{assign var="error_focus" value="true"}
|
|
{/if}
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
</div>
|
|
</fieldset>
|
|
|
|
{form_field form=$form field="newsletter"}
|
|
<div class="form-group group-newsletter{if $error} has-error{/if}">
|
|
<div class="control-input">
|
|
<div class="checkbox">
|
|
<label class="control-label" for="{$label_attr.for}">
|
|
<input type="checkbox" name="{$name}" id="{$label_attr.for}" value="{$value}"{if $checked} checked{/if} {if $required} aria-required="true" required{/if}>{$label}
|
|
</label>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
|
|
{form_field form=$form field="agreed"}
|
|
<div class="form-group group-agreed{if $error} has-error{/if}">
|
|
<div class="control-input">
|
|
<div class="checkbox">
|
|
<label class="control-label" for="{$label_attr.for}">
|
|
<input type="checkbox" name="{$name}" id="{$label_attr.for}" value="{$value}"{if $checked} checked{/if} {if $required} aria-required="true" required{/if}>I've read and agreed on <a href="#">Terms & Conditions</a></a>.
|
|
</label>
|
|
{if $error }
|
|
<span class="help-block">{$message}</span>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
{/form_field}
|
|
|
|
<div class="form-group group-btn">
|
|
<div class="control-btn">
|
|
<button type="submit" class="btn btn-register">{intl l="Register"}</button>
|
|
</div>
|
|
</div><!--/.form-group-->
|
|
</form>
|
|
{/form}
|
|
</article>
|
|
|
|
</div><!-- /.layout -->
|
|
{/block} |