remote form

formulaire à distance

Une fonction qui permettra de soumettre des formulaires via AJAX.

La fonction effectuera une requête basée sur le formulaire en utilisant window.fetch avec la charge utile codée en tant que paramètres d'URL si la méthode du formulaire est un GET et FormData pour toutes les autres méthodes.

L'objet de requête est disponible dans la fonction de rappel, permettant de modifier les en-têtes et le corps avant l'envoi de la requête.

Installation

 $ npm install --save @github/remote-form

Usage

 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 > 

Prise en charge du navigateur

Les navigateurs sans prise en charge native des éléments personnalisés nécessitent un polyfill.

• Chrome
• Firefox
• Safari
• Microsoft Bord

Développement

 npm install
npm test

Licence

Distribué sous licence MIT. Voir LICENCE pour plus de détails.