pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #137 from dod-ccpo/ui/field-validation-setup

Browse Source 
Ui/field validation setup
This commit is contained in:
andrewdds
2018-08-08 16:22:00 -04:00
committed by GitHub
parent 00f1500940 6bcf7dee28
commit cda0b6301b
7 changed files with 142 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
templates/base.html
View File

@@ -16,6 +16,7 @@
<body class="{% if g.modalOpen %} modalOpen{% endif %}">
<div id='app-root'>
{% block template_vars %}{% endblock %}
{% include 'navigation/topbar.html' %}
@@ -33,7 +34,6 @@
</div>
{% include 'footer.html' %}
{% block modal %}{% endblock %}
</div>

32
templates/styleguide.html
View File

@@ -130,15 +130,29 @@
<form>
<div class='usa-input'>
<label for='basic-text-1'>
Basic Text Input
<span class='usa-input__help'>
This is some help text to explain what this form field is and why you should fill it out.
</span>
</label>
<input id='basic-text-1' type='text' placeholder='this is a sample of what you should enter'/>
</div>
<textinput inline-template validation='dollars' value='1231231'>
<div v-bind:class="['usa-input usa-input--validation--' + validation, { 'usa-input--error': showError, 'usa-input--success': showValid }]">
<label for='basic-text-1'>
Dollars Text Input
<span class='usa-input__help'>
This is some help text to explain what this form field is and why you should fill it out.
</span>
<template v-if='showError'>{{ Icon('alert') }}</template>
<template v-if='showValid'>{{ Icon('ok') }}</template>
</label>
<masked-input
v-on:input='onInput'
v-on:change='onChange'
v-model='renderedValue'
id='basic-text-1'
type='text'
ref='input'
placeholder='$'
:guide="true"
:mask="mask">
</masked-input>
</div>
</textinput>
<div class='usa-input usa-input--error'>
<label for='basic-text-2'>