Refactored Form system to get simple error handling and a clearer
interface
This commit is contained in:
franck
@@ -235,4 +235,162 @@ hr {
|
||||
border: 1px solid #e5e5e5;
|
||||
.border-radius;
|
||||
.box-shadow;
|
||||
}
|
||||
|
||||
// -- Allow inline forms validation states ------------------------------------
|
||||
|
||||
.form-inline .warning .control-label,
|
||||
.form-inline .warning .help-block,
|
||||
.form-inline .warning .help-inline {
|
||||
color: #c09853;
|
||||
}
|
||||
|
||||
.form-inline .warning .checkbox,
|
||||
.form-inline .warning .radio,
|
||||
.form-inline .warning input,
|
||||
.form-inline .warning select,
|
||||
.form-inline .warning textarea {
|
||||
color: #c09853;
|
||||
}
|
||||
|
||||
.form-inline .warning input,
|
||||
.form-inline .warning select,
|
||||
.form-inline .warning textarea {
|
||||
border-color: #c09853;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
|
||||
.form-inline .warning input:focus,
|
||||
.form-inline .warning select:focus,
|
||||
.form-inline .warning textarea:focus {
|
||||
border-color: #a47e3c;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #dbc59e;
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #dbc59e;
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #dbc59e;
|
||||
}
|
||||
|
||||
.form-inline .warning .input-prepend .add-on,
|
||||
.form-inline .warning .input-append .add-on {
|
||||
color: #c09853;
|
||||
background-color: #fcf8e3;
|
||||
border-color: #c09853;
|
||||
}
|
||||
|
||||
.form-inline .error .control-label,
|
||||
.form-inline .error .help-block,
|
||||
.form-inline .error .help-inline {
|
||||
color: #b94a48;
|
||||
}
|
||||
|
||||
.form-inline .error .checkbox,
|
||||
.form-inline .error .radio,
|
||||
.form-inline .error input,
|
||||
.form-inline .error select,
|
||||
.form-inline .error textarea {
|
||||
color: #b94a48;
|
||||
}
|
||||
|
||||
.form-inline .error input,
|
||||
.form-inline .error select,
|
||||
.form-inline .error textarea {
|
||||
border-color: #b94a48;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
|
||||
.form-inline .error input:focus,
|
||||
.form-inline .error select:focus,
|
||||
.form-inline .error textarea:focus {
|
||||
border-color: #953b39;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
|
||||
}
|
||||
|
||||
.form-inline .error .input-prepend .add-on,
|
||||
.form-inline .error .input-append .add-on {
|
||||
color: #b94a48;
|
||||
background-color: #f2dede;
|
||||
border-color: #b94a48;
|
||||
}
|
||||
|
||||
.form-inline .success .control-label,
|
||||
.form-inline .success .help-block,
|
||||
.form-inline .success .help-inline {
|
||||
color: #468847;
|
||||
}
|
||||
|
||||
.form-inline .success .checkbox,
|
||||
.form-inline .success .radio,
|
||||
.form-inline .success input,
|
||||
.form-inline .success select,
|
||||
.form-inline .success textarea {
|
||||
color: #468847;
|
||||
}
|
||||
|
||||
.form-inline .success input,
|
||||
.form-inline .success select,
|
||||
.form-inline .success textarea {
|
||||
border-color: #468847;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
|
||||
.form-inline .success input:focus,
|
||||
.form-inline .success select:focus,
|
||||
.form-inline .success textarea:focus {
|
||||
border-color: #356635;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
|
||||
}
|
||||
|
||||
.form-inline .success .input-prepend .add-on,
|
||||
.form-inline .success .input-append .add-on {
|
||||
color: #468847;
|
||||
background-color: #dff0d8;
|
||||
border-color: #468847;
|
||||
}
|
||||
|
||||
.form-inline .info .control-label,
|
||||
.form-inline .info .help-block,
|
||||
.form-inline .info .help-inline {
|
||||
color: #3a87ad;
|
||||
}
|
||||
|
||||
.form-inline .info .checkbox,
|
||||
.form-inline .info .radio,
|
||||
.form-inline .info input,
|
||||
.form-inline .info select,
|
||||
.form-inline .info textarea {
|
||||
color: #3a87ad;
|
||||
}
|
||||
|
||||
.form-inline .info input,
|
||||
.form-inline .info select,
|
||||
.form-inline .info textarea {
|
||||
border-color: #3a87ad;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
|
||||
.form-inline .info input:focus,
|
||||
.form-inline .info select:focus,
|
||||
.form-inline .info textarea:focus {
|
||||
border-color: #2d6987;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3;
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3;
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3;
|
||||
}
|
||||
|
||||
.form-inline .info .input-prepend .add-on,
|
||||
.form-inline .info .input-append .add-on {
|
||||
color: #3a87ad;
|
||||
background-color: #d9edf7;
|
||||
border-color: #3a87ad;
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
{check_auth context="admin" roles="ADMIN"}
|
||||
{check_auth context="admin" roles="ADMIN" login_url="login"}
|
||||
{$page_title={intl l='Home'}}
|
||||
{include file='includes/header.inc.html'}
|
||||
|
||||
|
||||
@@ -13,28 +13,36 @@
|
||||
<div class="hero-unit">
|
||||
<h1>{intl l='Thelia Back Office'}</h1>
|
||||
|
||||
{form name="thelia.admin.login" success_url="home" error_url="login"}
|
||||
<form action="checklogin" method="post" class="well form-inline" {form_enctype form=$form}>
|
||||
|
||||
{if isset($message)}<div class="alert alert-error">{$message}</div>{/if}
|
||||
|
||||
{form_field_hidden form=$form}
|
||||
{form_hidden_fields form=$form}
|
||||
|
||||
{form_field form=$form.username}
|
||||
{form_error form=$form.username}{$message}{/form_error}
|
||||
<input type="text" class="input" placeholder="{intl l='E-mail address'}" name="{$name}" />
|
||||
{form_field form=$form field='success_url'}
|
||||
<input type="hidden" name="{$name}" value="{url path='admin'}" /> {* redirect to /admin *}
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form field='username'}
|
||||
<span {if $error}class="error"{/if}>
|
||||
<input type="text" class="input" placeholder="{intl l='User name'}" name="{$name}" value="{$value}" {$attr} />
|
||||
</span>
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.password}
|
||||
{form_error form=$form.password}{$message}{/form_error}
|
||||
<input type="password" class="input" placeholder="{intl l='Password'}" name="{$name}" />
|
||||
{form_field form=$form field='password'}
|
||||
<span {if $error}class="error"{/if}>
|
||||
<input type="password" class="input" placeholder="{intl l='Password'}" name="{$name}" {$attr} />
|
||||
</span>
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.remember_me}
|
||||
<label class="checkbox"> <input type="checkbox" name="remember" value="yes" /> {intl l='Remember me'}</label>
|
||||
{form_field form=$form field='remember_me'}
|
||||
<label class="checkbox"> <input type="checkbox" name="{$name}" value="{$value}" {$attr} {if $options.checked}checked="checked"{/if}/> {intl l='Remember me'}</label>
|
||||
{/form_field}
|
||||
|
||||
<span class="pull-right"><button type="submit" class="btn btn-primary">{intl l='Login'} <i class="icon-play icon-white"></i></button></span>
|
||||
</form>
|
||||
{/form}
|
||||
</div>
|
||||
|
||||
{module_include location='index_middle'}
|
||||
|
||||
@@ -3,10 +3,10 @@
|
||||
{form name="thelia.customer.creation"}
|
||||
<form method="post" action="index_dev.php?action=createCustomer&view=connexion" {form_enctype form=$form} >
|
||||
|
||||
{form_field_hidden form=$form}
|
||||
{form_hidden_fields form=$form}
|
||||
|
||||
{form_field form=$form.title}
|
||||
{form_error form=$form.title}
|
||||
{form_field form=$form field="title"}
|
||||
{form_error form=$form field="title"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
@@ -19,64 +19,64 @@
|
||||
<br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.firstname}
|
||||
{form_error form=$form.firstname}
|
||||
{form_field form=$form field="firstname"}
|
||||
{form_error form=$form field="firstname"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr} > <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.lastname}
|
||||
{form_error form=$form.lastname}
|
||||
{form_field form=$form field="lastname"}
|
||||
{form_error form=$form field="lastname"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr} > <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.address1}
|
||||
{form_error form=$form.address1}
|
||||
{form_field form=$form field="address1"}
|
||||
{form_error form=$form field="address1"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr} > <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.address2}
|
||||
{form_error form=$form.address2}
|
||||
{form_field form=$form field="address2"}
|
||||
{form_error form=$form field="address2"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr} > <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.address3}
|
||||
{form_error form=$form.address3}
|
||||
{form_field form=$form field="address3"}
|
||||
{form_error form=$form field="address3"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr} > <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.zipcode}
|
||||
{form_error form=$form.zipcode}
|
||||
{form_field form=$form field="zipcode"}
|
||||
{form_error form=$form field="zipcode"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr} > <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.city}
|
||||
{form_error form=$form.city}
|
||||
{form_field form=$form field="city"}
|
||||
{form_error form=$form field="city"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr} > <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.country}
|
||||
{form_error form=$form.country}
|
||||
{form_field form=$form field="country"}
|
||||
{form_error form=$form field="country"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
|
||||
@@ -89,43 +89,43 @@
|
||||
<br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.phone}
|
||||
{form_error form=$form.phone}
|
||||
{form_field form=$form field="phone"}
|
||||
{form_error form=$form field="phone"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr}> <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.cellphone}
|
||||
{form_error form=$form.cellphone}
|
||||
{form_field form=$form field="cellphone"}
|
||||
{form_error form=$form field="cellphone"}
|
||||
{$message}
|
||||
{/form_error}
|
||||
<label> <span>{intl l="{$label}"} : </span></label><input type="text" name="{$name}" value="{$value}" {$attr}> <br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.email}
|
||||
{form_error form=$form.email}
|
||||
{form_field form=$form field="email"}
|
||||
{form_error form=$form field="email"}
|
||||
{#message}
|
||||
{/form_error}
|
||||
<label><span>{intl l="{$label}"}</span></label><input type="email" name="{$name}" value="{$value}" {$attr} ><br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.email_confirm}
|
||||
{form_error form=$form.email_confirm}
|
||||
{form_field form=$form field="email_confirm"}
|
||||
{form_error form=$form field="email_confirm"}
|
||||
{#message}
|
||||
{/form_error}
|
||||
<label><span>{intl l="{$label}"}</span></label><input type="email" name="{$name}" {$attr} ><br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.password}
|
||||
{form_error form=$form.password}
|
||||
{form_field form=$form field="password"}
|
||||
{form_error form=$form field="password"}
|
||||
{#message}
|
||||
{/form_error}
|
||||
<label><span>{intl l="{$label}"}</span></label><input type="password" name="{$name}" {$attr} ><br />
|
||||
{/form_field}
|
||||
|
||||
{form_field form=$form.password_confirm}
|
||||
{form_error form=$form.password_confirm}
|
||||
{form_field form=$form field="password_confirm"}
|
||||
{form_error form=$form field="password_confirm"}
|
||||
{#message}
|
||||
{/form_error}
|
||||
<label><span>{intl l="{$label}"}</span></label><input type="password" name="{$name}" {$attr} ><br />
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
{include file="includes/header.html"}
|
||||
<div>
|
||||
|
||||
{loop type="auth" name="auth_test" roles="CUSTOMER"}
|
||||
{loop type="auth" name="auth_test" context="front" roles="CUSTOMER"}
|
||||
|
||||
<p>Customer is authentified :-)</p>
|
||||
{/loop}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user