jQuery UI in Action

538 Pages·2016·11.44 MB·English

by  VanToll T.J.

jQuery UI in Action
TJ VanToll
Copyright
For online information and ordering of this and other Manning books, please
visit www.manning.com. The publisher offers discounts on this book when
ordered in quantity. For more information, please contact
Special Sales Department
Manning Publications Co.
20 Baldwin Road
PO Box 761
Shelter Island, NY 11964
Email: [email protected]
©2015 by Manning Publications Co. All rights reserved.
No part of this publication may be reproduced, stored in a retrieval system, or
transmitted, in any form or by means electronic, mechanical, photocopying, or
otherwise, without prior written permission of the publisher.
Many of the designations used by manufacturers and sellers to distinguish their
products are claimed as trademarks. Where those designations appear in the
book, and Manning Publications was aware of a trademark claim, the
designations have been printed in initial caps or all caps.
Recognizing the importance of preserving what has been written, it is
Manning’s policy to have the books we publish printed on acid-free paper, and
we exert our best efforts to that end. Recognizing also our responsibility to
conserve the resources of our planet, Manning books are printed on paper that is
at least 15 percent recycled and processed without the use of elemental chlorine.
Manning Publications Co. Development editor: Sean Dennis
20 Baldwin Road Technical development editor: Teresa Burger
Shelter Island, NY 11964 Copyeditor: Teresa Wilson
Proofreader: Elizabeth Martin
Typesetter: Gordan Salinovic
Cover designer: Marija Tudor
ISBN 9781617291937
Printed in the United States of America
Printed in the United States of America
1 2 3 4 5 6 7 8 9 10 – EBM – 19 18 17 16 15 14
Brief Table of Contents
Copyright
Brief Table of Contents
Table of Contents
Foreword
Preface
Acknowledgments
About this Book
About the Cover Illustration
1. Meet jQuery UI
Chapter 1. Introducing jQuery UI
Chapter 2. Enhancing UIs with widgets
2. jQuery UI Core
Chapter 3. Building complex web forms with jQuery UI
Chapter 4. Enhancing interfaces with layout and utility widgets
Chapter 5. Adding interaction to your interfaces
Chapter 6. Creating rich animations with effects
Chapter 7. Theming and styling applications with jQuery UI
3. Customization and advanced usage
Chapter 8. Using the widget factory to build stateful plugins
Chapter 9. Extending widgets with the widget factory
Chapter 10. Preparing your application for production
Chapter 11. Building a flight-search application
Chapter 12. Under the hood of jQuery UI
Appendix A. Learning jQuery
Appendix B. How jQuery UI tests jQuery UI
Appendix C. Using jQuery UI with Backbone
Appendix D. Creating decimal, currency, and time pickers with Globalize
Appendix E. Contributing to jQuery UI
Appendix F. Polyfilling HTML5 with jQuery UI
Index
List of Figures
List of Tables
List of Listings
Table of Contents
Copyright
Brief Table of Contents
Table of Contents
Foreword
Preface
Acknowledgments
About this Book
About the Cover Illustration
1. Meet jQuery UI
Chapter 1. Introducing jQuery UI
1.1. What is in jQuery UI?
1.2. The benefits of using jQuery UI
1.2.1. Cohesive and consistent APIs
1.2.2. Comprehensive browser support
1.2.3. Open source and free to use
1.2.4. Thorough documentation
1.2.5. Powerful theming mechanism
1.2.6. Emphasis on accessibility
1.2.7. Stable and maintenance friendly
1.3. The limitations of jQuery UI
1.3.1. Lack of widgets
1.3.2. jQuery UI and mobile devices
1.4. Getting started with the library
1.4.1. Versions of the library
1.4.2. Downloading from the jQuery UI website
1.4.3. Downloading from CDNs
1.5. The first example
1.6. Using an online testing tool
1.7. Summary
Chapter 2. Enhancing UIs with widgets
2.1. Creating widgets
2.2. Customizing widgets with options
2.3. Modifying widgets with methods
2.3.1. Invoking methods
2.3.2. Using option() to modify widgets
2.3.3. Using dialogs to edit lists
2.4. Responding to widget changes with events
2.4.1. Subscribing to widget events
2.4.2. Event handlers vs. callbacks
2.4.3. Event parameters
2.5. Summary
2. jQuery UI Core
Chapter 3. Building complex web forms with jQuery UI
3.1. The challenges of building modern web forms
3.2. Autocomplete: suggesting input options to users
3.2.1. Using local data
3.2.2. Loading from a remote source
3.2.3. Using autocomplete with third-party services and APIs
3.3. Button: enhancing native buttons, inputs, and links
3.4. Selectmenu: enhancing native <select> elements
3.5. Datepicker: selecting dates from a pop-up calendar
3.5.1. Parsing and formatting dates
3.5.2. Handling date globalization
3.6. Spinner: enhancing native <input> elements to collect numeric
data
3.7. Completing the appointment form
3.8. HTML5 elements vs. jQuery UI widgets
3.9. Summary
Chapter 4. Enhancing interfaces with layout and utility widgets
4.1. Accordion: creating toggleable content panels
4.1.1. Configuring the accordion widget
4.1.2. Adding and removing panels
4.2. Tabs: toggling between content areas
4.2.1. Loading remote content
4.2.2. Loading movie information in a tabs widget
4.3. Menu: creating web menus with semantic markup
4.4. Dialog: displaying content in a pop-up container
4.5. Progressbar: displaying the progress of a task
4.6. Slider: selecting a value using moveable handles
4.6.1. Building range sliders
4.6.2. Adding a font size range
4.7. Tooltip: enhancing native tooltips with a customizable control
4.7.1. Using custom tooltip content
4.7.2. Displaying a preview in a tooltip
4.8. Summary
Chapter 5. Adding interaction to your interfaces
5.1. Draggable: allowing users to move elements
5.2. Droppable: creating containers that accept draggables
5.2.1. Building a drag-and-drop game
5.2.2. Building a shopping cart
5.3. Sortable: rearranging elements in a list
5.3.1. Building connected lists
5.3.2. Building a fruit and vegetable sorting game
5.4. Resizable: allowing users to change the size of elements
5.4.1. Using custom resize handles
5.4.2. Building an appointment scheduler
5.5. Selectable: allowing users to select elements from a group
5.6. Creating multidevice interactions: the importance of touch
5.6.1. Why doesn’t jQuery UI support touch events?
5.6.2. Introducing jQuery UI Touch Punch
5.7. Summary
Chapter 6. Creating rich animations with effects
6.1. Using effects and the effect() method
6.1.1. Customizing effects with easings
6.1.2. Making visual associations with the transfer effect
6.2. Animating visibility changes
6.2.1. Building form validation messages
6.2.2. Building portlets with jQuery UI