Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
KNOCKOUTJS BLUEPRINTS

You're reading from   KNOCKOUTJS BLUEPRINTS Learn how to design and create amazing web applications using KnockoutJS

Arrow left icon
Product type Paperback
Published in Feb 2015
Publisher
ISBN-13 9781783980840
Length 218 pages
Edition 1st Edition
Languages
Arrow right icon
Author (1):
Arrow left icon
Carlo Russo Carlo Russo
Author Profile Icon Carlo Russo
Carlo Russo
Arrow right icon
View More author details
Toc

Writing the Search Form component

Now that we know how to create a component, and we put the base of our Search Form component, we can try to look for the requirements for this component.

A designer will review the View later, so we need to keep it simple to avoid the need for multiple changes later.

From our analysis, we find that our competitors use these components:

  • Autocomplete field for the city
  • Calendar fields for check-in and check-out
  • Selection field for the number of rooms, number of adults and number of children, and age of children

This is a wireframe of what we should build (we got inspired by Trivago):

Writing the Search Form component

We could do everything by ourselves, but the easiest way to realize this component is with the help of a few external plugins; we are already using jQuery, so the most obvious idea is to use jQuery UI to get the Autocomplete Widget, the Date Picker Widget, and maybe even the Button Widget.

Adding the AMD version of jQuery UI to the project

Let's start downloading the current version...

You have been reading a chapter from
KNOCKOUTJS BLUEPRINTS
Published in: Feb 2015
Publisher:
ISBN-13: 9781783980840
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $19.99/month. Cancel anytime
Banner background image