Skip to content

A Vue.js directive for sending data from form and primitive validation

Notifications You must be signed in to change notification settings

AlekseyPleshkov/vue-form-send

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Vue Form Send

A Vue.js directive for sending data from form and primitive validation inputs

Installation

npm i --save-dev vue-form-send
import VueFormSend from 'vue-form-send'

Vue.use(VueFormSend)

SSR (Nuxt.js)

import VueFormSend from 'vue-form-send/dist/ssr.index'

Vue.use(VueFormSend)

Usage

<form v-form-send='{success: successResult, fail: failResult}' class='form' action='./send.php' method='post'>
  <input v-form-input='{length: 5}' name='phone' type='text' placeholder='Length > 5'/>
  <input v-form-input='{length: 5, replace: ["-", "/"]}' name='phone' type='text' placeholder='Length > 5 and replace'/>
  <input v-form-input='{length: 5, clean: true}' name='phone' type='text' placeholder='Length > 5 and clear'/>
  <input v-form-input='{length: 5, timeoutError: 0, changeValidation: true}' name='phone' type='text' placeholder='Length > 5 and timeoutErorr 0'/>
  <input v-form-input='{length: 5, changeValidation: true}' name='phone' type='text' placeholder='Length > 5 and changeValidation'/>
  <input v-form-input='{type: "checked"}' name='phone' type='checkbox'/> 
  <button>Send</button>
</form>

Directive options

Form

Option Value type Description
pressButton Function Call function after click to form button
success Function Call function after success send data
fail Function Call function is fail validation or send data
credentials Boolean Use credentials
auth Function -> {type: String, data: String} User auth. Return object with auth type and data string format username:password

Element

Option Value type Description
length Integer Check length value of element
replace Boolean Replacing symbols from text value
clear Boolean Clear value after success send data
timeoutError Integer Timeout for remove error class
changeValidation Boolean Real-time validaton if change input value
type String Types of verification (length of checked). Default - length.

About

A Vue.js directive for sending data from form and primitive validation

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published