remote form
v0.4.3
Uma função que permitirá o envio de formulários via AJAX.
A função fará uma solicitação baseada no formulário usando window.fetch
com a carga codificada como parâmetros de URL se o método do formulário for GET
e FormData
para todos os outros métodos.
O objeto request está disponível na função de retorno de chamada, permitindo que os cabeçalhos e o corpo sejam modificados antes do envio da solicitação.
$ npm install --save @github/remote-form
import { remoteForm } from '@github/remote-form'
// Make all forms that have the `data-remote` attribute a remote form.
remoteForm ( 'form[data-remote]' , async function ( form , wants , request ) {
// Before we start the request
form . classList . remove ( 'has-error' )
form . classList . add ( 'is-loading' )
let response
try {
response = await wants . html ( )
} catch ( error ) {
// If the request errored, we'll set the error state and return.
form . classList . remove ( 'is-loading' )
form . classList . add ( 'has-error' )
return
}
// If the request succeeded we can do something with the results.
form . classList . remove ( 'is-loading' )
form . querySelector ( '.results' ) . innerHTML = response . html
} )
< form action =" /signup " method =" post " data-remote >
< label for =" username " > Username </ label >
< input id =" username " type =" text " >
< label for =" password " > Username </ label >
< input id =" password " type =" password " >
< button type =" submit " > Log in </ button >
< div class =" results " > </ div >
</ form >
Navegadores sem suporte nativo a elementos personalizados exigem um polyfill.
npm install
npm test
Distribuído sob a licença do MIT. Consulte LICENÇA para obter detalhes.