Reader small image

You're reading from  Vue.js 2 Cookbook

Product typeBook
Published inApr 2017
Reading LevelBeginner
PublisherPackt
ISBN-139781786468093
Edition1st Edition
Languages
Right arrow
Author (1)
Andrea Passaglia
Andrea Passaglia
author image
Andrea Passaglia

Andrea Passaglia was born in Genoa, in northern Italy. Interested about technology since his parents gave him a toy computer when he was a boy, he started studying web technologies at an early age. After obtaining his master's degree in computer engineering he worked on the design and implementation of web interfaces for companies of various sizes and in different industries (healthcare, fashion, tourism, and transport). In 2016 he moves in the silicon valley of Europe to tackle new problems in the banking industry at the Edgeverve Dublin Research and Development Labs. A backend technologist by trade, Vue.js is his first tool to bring to life his creations when it comes to the frontend. Andrea is married to a lovely Russian girl from Siberia and they often cook together mixing culinary traditions.
Read more about Andrea Passaglia

Right arrow

Creating a form with checkboxes


Asking for user input is fundamental in today's web apps. Presenting the user with multiple choices makes the interface more fun to use and is necessary for structured input.

In this recipe, you will learn how to create checkboxes by building a confirmation page for your own print shop!

Getting ready

We already know how data binding works in Vue, so you are good to go. Otherwise go back to the first recipe, collect 200, and then proceed to the React to events like clicks and keystrokes recipe in Chapter 1, Getting started with Vue.js, to learn more about the v-model directive.

How to do it...

Let's suppose you have to set up a Martian printing shop with three different printers:

  • Monochrome printer
  • Plasma Color printer
  • 3D DNA Clone printer

The confirmation page will basically be just a form:

<div id="app"> 
  <form> 
    <!-- list of printers go here --> 
  </form> 
</div>

Instead of name, we will use v-model to bind our model to the view...

lock icon
The rest of the page is locked
Previous PageNext Page
You have been reading a chapter from
Vue.js 2 Cookbook
Published in: Apr 2017Publisher: PacktISBN-13: 9781786468093

Author (1)

author image
Andrea Passaglia

Andrea Passaglia was born in Genoa, in northern Italy. Interested about technology since his parents gave him a toy computer when he was a boy, he started studying web technologies at an early age. After obtaining his master's degree in computer engineering he worked on the design and implementation of web interfaces for companies of various sizes and in different industries (healthcare, fashion, tourism, and transport). In 2016 he moves in the silicon valley of Europe to tackle new problems in the banking industry at the Edgeverve Dublin Research and Development Labs. A backend technologist by trade, Vue.js is his first tool to bring to life his creations when it comes to the frontend. Andrea is married to a lovely Russian girl from Siberia and they often cook together mixing culinary traditions.
Read more about Andrea Passaglia