Trail ValetV2: A Day at the SPA

getTrails(){fetch(this.baseTrailURL).then(r => r.json()).then(trails => {trails.forEach(trail => {const t = new Trail(trail)t.buildTrailHtml()t.valets.forEach(valet => {const v = new Valet(valet)v.buildValetHtml()})})}).catch(error => console.error(error))}
addValetToTrail(){const trail = document.getElementById(`create-valet-button-for-trail-${this.id}`)const valetForm = document.createElement('form')valetForm.id = `Add-valet-form-to-trail-${this.id}`valetForm.trailID = this.idvaletForm.innerHTML = `<input id='form-valet-location' placeholder='location' type='text'/><br><input id='form-valet-issue' placeholder='issue' type='text'/><br><input value='Create Valet for ${this.name}' type='submit'>`trail.append(valetForm)valetForm.addEventListener(`submit`, this.createValet)}
event.preventDefault()const valetLocation = event.target.children[0]const valetIssue = event.target.children[2]const trailID = this.trailIDconsole.log(trailID)fetch("http://localhost:3000/valets", {method: "POST",headers: {"Content-Type": "application/json",Accept: "application/json"},body: JSON.stringify({location: valetLocation.value,issue: valetIssue.value,trail_id: trailID})}).then(resp => resp.json()).then(valetData => {if (valetData.status === "found"){const nt = new Valet(valetData.valet)nt.buildValetHtml()valetIssue.value = ""valetLocation.value = ""}else {alert(valetData.errors)}}).catch(err => console.error(err))}
.then(data  => {if (data.status === 200) {const valetItem = document.getElementById(`valet-id-${data.valet.id}`)valetItem.children[2].innerText = "fixed"valetItem.children[3].hidden = data.valet.fixed

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

JavaScript 10 important questions

That one little thing… that will drive you mad

Do something on the web about the web

How to Setup Jest with Vue to test your Vue components.{draft}

Package Spring Boot and React into Single App

10 Best Sports Water Bottles Tested & Reviewed https://t.co/gU5nwYWyBu https://t.co/gjlEY1Z5MM

Checking that a Predicate is True for All Typescript Array Elements

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Zachary Williams

Zachary Williams

More from Medium

You Don't Know JS: Up and Going Summary

How to write bad code

Diagrams to compare

Preview of an uploaded video in React

How becoming a remote developer has brought greater joy to my life.