Dynamic Web Forms Professional Projects by Dan Ransom ISBN: 1931841136 Premier Press © 2002 (755 pages) A step-by-step guide to help you learn lively Web form development by means of JavaScript, PHP, MySQL, Apache, and more. Table of Contents Dynamic Web Forms Professional Projects Introduction Part I - Dynamic Web Forms Overview Chapter 1 - Introduction to Dynamic Web Forms Chapter 2 - Dynamic Web Form Concepts and Considerations Chapter 3 - HTML Forms Chapter 4 - JavaScript and Web Forms Chapter 5 - Server-Side Scripting and Relational Databases Chapter 6 - Modular Interface Design Part II - Project 1: Creating Membership Forms Chapter 7 - Project 1 Preparation: Designing for Modularization Chapter 8 - Creating the Forms Chapter 9 - Completing the Membership Interface Part III - Project 2: Creating Catalog Forms Chapter 10 - User Interface Design Chapter 11 - Designing a User Interface Chapter 12 - Creating the Online Catalog Interface Chapter 13 - Completing the Catalog Interface Part IV - Project 3: Creating Online Information Systems Chapter 14 - Functional Design Chapter 15 - Designing a Functional Interface Chapter 16 - Creating the Online Information System Itself Chapter 17 - Completing the Information System Interface Part V - Beyond the Lab Chapter 18 - XML and XForms Chapter 19 - Embedded Web Form Technologies Part VI - Appendices Appendix A - HTML Form Elements Reference Appendix B - Recommended Naming Conventions Appendix C - Resources for Web Forms Index List of Figures List of Tables List of Sidebars Dynamic Web Forms Professional Projects Dan Ransom © 2002 by Premier Press, Inc. All rights reserved. No part of this book may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording, or by any information storage or retrieval system without written permission from Premier Press, except for the inclusion of brief quotations in a review. The Premier Press logo, top edge printing, and related trade dress are trademarks of Premier Press, Inc. and may not be used without written permission. All other trademarks are the property of their respective owners. Important: Premier Press cannot provide software support. Please contact the appropriate software manufacturer’s technical support line or Web site for assistance. Premier Press and the author have attempted throughout this book to distinguish proprietary trademarks from descriptive terms by following the capitalization style used by the manufacturer. Information contained in this book has been obtained by Premier Press from sources believed to be reliable. However, because of the possibility of human or mechanical error by our sources, Premier Press, or others, the Publisher does not guarantee the accuracy, adequacy, or completeness of any information and is not responsible for any errors or omissions or the results obtained from use of such information. Readers should be particularly aware of the fact that the Internet is an ever-changing entity. Some facts may have changed since this book went to press. ISBN: 1-931841-13-6 Library of Congress Catalog Card Number: 2001098163 Printed in the United States of America 02 03 04 05 RI 10 9 8 7 6 5 4 3 2 1 Publisher: Stacy L. Hiquet Marketing Manager: Heather Buzzingham Managing Editor: Sandy Doell Acquisitions Editor: Kevin Harreld Project Editor: Estelle Manticas Editorial Assistant: Margaret Bauer Technical Reviewer: Michelle Jones Copy Editor: Hilary Powers Interior Layout: Shawn Morningstar Cover Design: Mike Tanamachi Indexer: Sharon Shock Proofreader: Lorraine Gunter Dedication This one’s just for me Acknowledgments I’d like to take this opportunity to thank everyone who made this book possible. Thanks to Kim and Stacy; they took a chance and gave me a shot. Thanks also to Estelle, Kevin, and all the editors who had the patience to deal with my not-so-minor annoyances. A very special thanks to my friends and family who had to deal with a lot of unreturned phone calls and missed gatherings while I spent nights and weekends over a keyboard to put this together. Finally, thanks to God and everyone else who never quite gets thanked enough—you know who you are. About the Author Dan Ransom is a rarity among Web developers: a generalist. He has a solid grounding and experience in graphic design, programming, user interface design, Website architecture, and code optimization. Surprisingly, despite all this, he can still put together a bit of code that doesn’t look like it was based on an Escher drawing. Currently Dan works as an Internet consultant for Scribner and Associates (www.scribnerconsulting.com). When he’s not redesigning user interfaces Dan dabbles in Flash and Java, and he plays Unreal Tournament at least twice a week (for stress). Dan lives outside Sacramento, California and plays the harmonica, badly. Introduction This book is intended to take a developer to the next step in Web interface design. JavaScript programmers will learn how to leverage their skills to create effective server- side scripts, server-side developers will learn how to extend their knowledge to the client environment, and everyone will learn the concepts behind creating modular, usable, and functional form-based user interfaces. What’s in this Book? Creating dynamic Web forms is more than simply slapping some code onto an HTML form. This book provides a hands-on approach to learning dynamic Web form development using popular freeware technologies such as JavaScript, PHP, MySQL, and Apache. I have included many examples of ready-to-use code that can be applied to most any Website. Part I of the book covers the basic principles of how the code is created and reviews the technologies needed to start creating dynamic Web forms. The majority of this book—Parts II, III, and IV—consists of three professional projects. These projects are based on the types of real-life interfaces wherein dynamic Web forms can be of benefit. These projects move from simple dynamic membership forms to a multi-functional information systems interface. Along the way you’ll learn more about each of the technologies involved and the specifics of how they can be applied to Web forms. While the server-side code used for the three projects is based on the combination of PHP and MySQL, the focus is less on the specifics of code and more on how the functionality is achieved. I’ve included information on how these methods can be applied using other relational databases or server-side scripts. Developers familiar with JSP, ASP, or ColdFusion will not only come away with an understanding of the basics of PHP, but will be able to apply many of the same methods and techniques to their preferred development environment. Part V includes two chapters that offer information on other dynamic Web form technologies. Chapter 18 includes a comprehensive overview of XForms, the W3C specification that has the potential to utterly change the way Web interfaces are created. The time for XForms has not yet come, but with this introduction you should be prepared for when it does. Chapter 19 compares and reviews some of the embedded technologies: Flash, ActiveX, and Java Applets. Who Should Read this Book? This book is intended for the intermediate to advanced Web developer. You should have a grounding in some type of Web scripting language, either client- or server-side. Experience with relational databases will help, but is not required. The projects in this book primarily use JavaScript and PHP. Knowledge of one or both of these languages will allow you to bypass much of the introductory chapters and go directly to the projects. Developers familiar with other scripting languages, such as PerlScript or VBScript, should be able to easily use these skills to adapt the projects to their preferred technology. A solid grasp of HTML is required for all readers. How to Use this Book Because this book is intended for different types of Web developers, there are numerous ways that it can be used. The majority of readers will benefit by following along with the book through each project step-by-step. This will give you the most comprehensive coverage of all the topics. Some developers however will be more interested in a specific application of dynamic Web forms and may skip to the project that interests them the most. Still others will want the book mostly for the ready-to-use code examples. In this case, the projects serve more as a guidebook to how the code can be implemented rather than as a learning tool. Finally, some developers may want to use this book as a handy informational resource. This books gathers together information on a wide variety of topics relating to Web interfaces, and some developers may wish to give it a quick review then bookmark the sections most likely to be needed in the future. The following conventions are used in this book: Note Notes give additional information that may be of interest, but is not required to accomplish the task at hand. Caution Cautions are used to alert you to the potential hazards the may result if a task is performed incorrectly. New Term Definition Terms that may be unfamiliar to you or that may have multiple meanings are noted and defined as part of the text. Find It Online These messages direct you to Web sites that contain additional information, related material, or valuable resources. Because of the ever changing nature of the Web it is to be expected that some of these links could change or disappear altogether. What’s on the Web Site? This book includes an accompanying Web site located at http://www.premierpressbooks.com. Here you will find the project files and much of the sample code. Whenever source code is displayed for a file located on the Web site, the following notation is used: filename.html <? echo "PHP code goes here"; ?> Part I: Dynamic Web Forms Overview Chapter List Chapter 1: Introduction to Dynamic Web Forms Chapter 2: Dynamic Web Form Concepts and Considerations Chapter 3: HTML Forms Chapter 4: JavaScript and Web Forms Chapter 5: Server-Side Scripting and Relational Databases Chapter 6: Modular Interface Design Chapter 1: Introduction to Dynamic Web Forms If you’ve picked up this book, then you probably already have an idea what dynamic Web forms are.