Share
Wufoo er en webapplikasjon som har til hensikt å forenkle skjemaer. Skjemaer kan generelt være kjedelig å jobbe med. Du må skrive XHTML / CSS for skjemaelementene, sette opp sluttendekoden for å fange opp alle dataene og deretter jobbe med å generere brukbare rapporter for det. Wufoo forenkler hele prosessen fra formskaping for å integrere den på nettstedet ditt gjennom omfattende temastøtte for å lage flotte, brukbare rapporter for å analysere dataene dine.
Det gjør til og med mange avanserte ting, inkludert web kroker og en riktig API for å få tilgang til de samlede dataene. I dag ser vi på hvordan du lager en enkel skjema med Wufoo, og bruker deretter API-en til å få tilgang til og modifisere data samlet.
Først må vi sette opp et skjema slik at vi kan leke med det. Registrer deg for en ny konto hos Wufoo, og du blir tatt til en av de mest humoristiske blank søknadstilstandene hele tiden:
Klikk på knappen for å begynne å bygge et nytt skjema, og du blir tatt til skjemabyggerapplikasjonen. Grensesnittet er veldig intuitivt med et kontekstfølsomt panel til venstre og hovedformseksjonen til høyre. Å legge til elementer er så enkelt som å klikke på det eller dra det inn i hoveddelen.
Ved å klikke på det opprettede elementet kan du redigere alle relevante detaljer.
Siden vi ønsker å holde det så enkelt som mulig, vil bare et enkelt tekstfelt som tar en e-postadresse gjøre. Klikk på Lagre skjema, og vi er ferdige. Vi har opprettet vårt første skjema med null kode, og det tok 60 sekunder.
Integrering av den opprettede skjemaet med på vår side er utrolig enkelt. Gå til skjema siden og klikk på kode lenke til det nyopprettede skjemaet.
Wufoo gir en rekke måter for deg å få skjemaet til dine besøkende, inkludert en JavaScript-versjon som fungerer i en iframe, XHTML-kode for en komplett side som inneholder skjemaene eller bare en lenke du kan dele med vennene dine.
Wufoo API lar deg programmatisk hente, sende inn og modifisere data som er relevante for kontoen din, med svært lite oppstyr. API-settet består i hovedsak av to stabile, faste APIer og en annen under beta-testing. Vi ser på de stabile delene i dag.
Legg merke til at du bare vil kunne hente og sende inn data til allerede eksisterende skjemaer. Hvis du ønsker å lage skjemaer på fly, og deretter sende inn data til det eller bare lage nye felt gjennom API, er du ute av lykken. Den nåværende versjonen av API-en tillater ikke denne funksjonaliteten, men ser etter den i nær fremtid sammen med en rekke andre funksjoner.
Men først, du trenger en API-nøkkel. Du kan hente den fra API-informasjonskoblingen på siden der du får kodesnuttene dine.
Legg merke til API-nøkkelen din og ID-en for feltet du vil ha tilgang til og / eller endre. Vi bruker det snart.
Forespørsels-API lar deg hente informasjon du har samlet gjennom skjemaene dine, omgå Wufoo-webområdet. Hvis du ønsker å få alle de rå dataene og deretter lage en tilpasset rapport ut av det, er dette veien å gå.
Det første du må legge merke til er nettadressen du må be om å få til de riktige dataene. Nettadressen ser slik ut:
http://username.wufoo.com/api/query/
Erstatte brukernavn med brukernavnet ditt og du er god til å gå. De spørsmål deler lar dem Wufoo servere vite at du ønsker å hente informasjon fra serverne.
cURL er den enkleste måten for oss å sende data til serveren. Hvis du er litt ny til cURL og føler deg villig, anbefaler jeg deg å gå gjennom denne cURL-artikkelen her på Nettuts+.
La oss gå over kodedelen av en del. Vi trenger først API-nøkkelen vi har notert før. Vi trenger også navnet på skjemaet du vil hente data fra. Disse to sammen med versjonen av API-en vi bruker, to i vårt tilfelle, er de minste parametrene vi trenger for å gjøre en vellykket forespørsel.
Vi sammenkaller alle de nødvendige elementene som nøkkel / verdi par og lagrer det for senere bruk.
Deretter sender vi inn den riktige nettadressen som nevnt ovenfor sammen med forespørselsstrengen vi opprettet ovenfor. Vi lagrer også svaret på en variabel slik at vi kan bruke den.
$ resp holder svaret på vår forespørsel. Som standard returnerer Wufoo API-data data i et JSON-format. Hvis XML forekommer å være din nyttelast, må du legge til en ekstra parameter i forespørselsstrengen. Den ekstra parameteren tar formatet på w_format = format hvor format kan enten være XML eller JSON.
Den returnerte JSON nyttelast er faktisk ganske stor, som inneholder mange opplysninger. De relevante delene er vist nedenfor:
Hoveddelen er resultatet av forespørselen sammen med informasjon om ønsket formular, inkludert navn på skjemaet, tittel, URL, beskrivelse og mye annen informasjon.
Det andre interessepunktet er feltene, skjemaet inneholder. Siden vårt skjema var veldig enkelt med bare et enkelt felt, er våre returnerte data ganske korte. Uansett, den bærer informasjon om feltets ID, tittel og annen annen informasjon, inkludert om det er nødvendig eller ikke, en beskrivelse for feltet og så videre.
Det siste poenget er den delen som inneholder tingene selv. Hver oppføring for det valgte skjemaet returneres til innringeren som inneholder et myriade av informasjon, inkludert iden til oppføringen, verdien av feltene, brukerens IP, datoen den ble opprettet og så videre.
Fra dette punktet er det helt opp til deg hva du gjør med dataene. Du kan analysere dataene for å lage en fin tilpasset rapport, søke gjennom informasjonen for bestemte data eller bare skrive dem alle inn i et regneark eller en database. Din fantasi er grensen.
Send API gir deg muligheten til å sende inn data direkte til Wufoo-serverne. Denne API-en er spesielt nyttig hvis du absolutt trenger å bruke din egen XHTML / CSS mens du fremdeles bruker alle de bakre endemulighetene som Wufoo tilbyr. På denne måten får du det beste fra begge verdener: du får bruke ditt eget tilpassede utseende, men beholder all kraften til Wufoo.
Frontenden krever ingen signifikant forskjell. Som et eksempel, her er markeringen, jeg brukte for å teste ut sende API.
handler.php ser slik ut.
Det er et par ting å merke seg her. Som med forespørsels-API lagrer vi Apikey og formid, så vi kan bruke den senere. Vi fanger også verdien av POSTed-tekstboksen, så vi kan sende den til Wufoo oss selv.
Legg merke til at vi også har opprettet en variabel som heter fieldid. Dette korresponderer direkte med API-ID-en som finnes på API-nøkkelsiden.
Etter dette er alt som før. Vi sammenkaller strengen og bruker deretter cURL til å sende dataene til serveren. Serveren returnerer et JSON-svar som ser ut som nedenfor:
Det er det. Ingen problemer, ingen ikke-følelse. Å legge ut til Wufoo gjennom vår tilpassede kode er like enkelt som det.
Som en ekstra bonusfunksjon lar Wufoo deg nå legge til andre tjenester når en ny oppføring er logget inn i systemet. Du kan gjøre mange fine ting med denne fantastiske nye funksjonen, men jeg holder meg bare til å bruke denne funksjonen.
For å komme til varslingssiden, klikk på meldingslenken på skjema-siden.
Denne siden lar deg velge å bli varslet via en rekke alternativer, inkludert e-post og SMS eller post til tjenester som Highrise, Twitter og mange flere når en ny oppføring blir lagt ut. Men det er ikke de vi skal se på i dag. Den vi skal se på, er webkroker - en smart teknologi som lar utviklere motta HTTP-tilbakemeldinger når en oppføring blir sendt til Wufoo. Tenk på det som en tilbakekall på steroider.
På Wufoos side er alt du trenger å gjøre, å skrive inn en nettadresse som Wufoo vil poste data til hver gang. Alt du trenger for å sette opp en side som fanger POSTed-dataene på din side. For testformål kan du sette opp en konto hos PostBin som sparer deg for stresset. Skriv inn denne nettadressen i Wufoo, og du er alle satt. Et eksempel på dataene som ble lagt ut av Wufoo til måladressen vår.
Veldig greit, hvis jeg kan si det selv.
Og vi er ferdige! Vi så på å lage en enkel form med Wufoo og deretter hvordan å programmere manipulere og hente dataene vi har samlet gjennom Wufoo er enkel å bruke API. Forhåpentligvis har dette vært nyttig for deg, og du fant det interessant. Jeg følger nøye med kommentar-delen så chime der inne hvis du har noen spørsmål.
Spørsmål? Hyggelige ting å si? Kritikk? Treff kommentar delen og la meg en kommentar. Glad koding!
Visste du at du kan tjene opp til $ 600 for å skrive en PLUS-opplæring og / eller screencast for oss? Vi leter etter dybde og velskrevne opplæringsprogrammer om HTML, CSS, PHP og JavaScript. Hvis du er i stand til å kontakte Jeffrey på [email protected].
Vær oppmerksom på at faktisk kompensasjon vil være avhengig av kvaliteten på den endelige opplæringen og screencast.
Accentsconagua