Pro PHP and jQuery

Pro PHP and jQuery

by Jason Lengstorf
Released June 2010
Publisher(s): Apress
ISBN: 9781430228479

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

This book is for intermediate programmers interested in building AJAX web applications using jQuery and PHP. Along with teaching some advanced PHP techniques, it will teach you how to take your dynamic applications to the next level by adding a JavaScript layer with jQuery.

  • Learn to utilize built-in PHP functions to build calendar tools.

  • Learn how jQuery can be used for AJAX, animation, client-side validation, and more.

Table of contents

  1. Copyright
  2. About the Author
  3. About the Technical Reviewer
  4. Acknowledgments
  5. I. Getting Comfortable with jQuery
    1. 1. Introducing jQuery
      1. 1.1. Choosing jQuery over JavaScript
        1. 1.1.1. Understanding JavaScript Libraries
        2. 1.1.2. Understanding the Benefits of jQuery
        3. 1.1.3. Understanding the History of jQuery
      2. 1.2. Setting Up a Testing Environment
        1. 1.2.1. Installing Firefox
        2. 1.2.2. Installing Firebug
      3. 1.3. Including jQuery in Web Pages
        1. 1.3.1. Including a Downloaded Copy of the jQuery Library
        2. 1.3.2. Including a Remotely Hosted Copy of the jQuery Library
        3. 1.3.3. Using the Google AJAX Libraries API
      4. 1.4. Setting up a Test File
        1. 1.4.1. Introducing the jQuery Function ($)
        2. 1.4.2. Selecting DOM Elements Using CSS Syntax
          1. 1.4.2.1. Basic Selectors
            1. 1.4.2.1.1. Selecting Elements by Tag Type
            2. 1.4.2.1.2. Selecting Tags by Class Name
            3. 1.4.2.1.3. Selecting Elements by ID
            4. 1.4.2.1.4. Combining Selectors for More-Precise Selection
            5. 1.4.2.1.5. Using Multiple Selectors
          2. 1.4.2.2. Hierarchy Selectors
            1. 1.4.2.2.1. Selecting Descendant Elements
            2. 1.4.2.2.2. Selecting Child Elements
            3. 1.4.2.2.3. Selecting Next Elements
            4. 1.4.2.2.4. Selecting Sibling Elements
          3. 1.4.2.3. Basic Filters
            1. 1.4.2.3.1. Selecting First or Last Elements
            2. 1.4.2.3.2. Selecting Elements that Do Not Match a Selector
            3. 1.4.2.3.3. Selecting Even or Odd Elements
            4. 1.4.2.3.4. Selecting Elements by Index
          4. 1.4.2.4. Content Filters
            1. 1.4.2.4.1. Selecting Elements That Contain Certain Text
            2. 1.4.2.4.2. Selecting Elements That Contain a Certain Element
            3. 1.4.2.4.3. Selecting Elements That Are Empty
            4. 1.4.2.4.4. Selecting Elements That Are Parents
          5. 1.4.2.5. Visibility Filters
          6. 1.4.2.6. Attribute Filters
            1. 1.4.2.6.1. Selecting Elements That Match an Attribute and Value
            2. 1.4.2.6.2. Selecting Elements That Don't Have the Attribute or Don't Match the Attribute Value
          7. 1.4.2.7. Child Filters
            1. 1.4.2.7.1. Selecting Even or Odd Parameters or Parameters by Index or Equation
            2. 1.4.2.7.2. Selecting First or Last Child Elements
          8. 1.4.2.8. Form Filters
            1. 1.4.2.8.1. Matching by Form Element Type
            2. 1.4.2.8.2. Selecting Only Enabled or Disabled Form Elements
            3. 1.4.2.8.3. Selecting Checked or Selected Form Elements
      5. 1.5. Summary
    2. 2. Common jQuery Actions and Methods
      1. 2.1. Understanding the Basic Behavior of jQuery Scripts
      2. 2.2. Understanding jQuery Methods
        1. 2.2.1. Traversing DOM Elements
          1. 2.2.1.1. .eq()
          2. 2.2.1.2. .filter() and .not()
          3. 2.2.1.3. .first() and .last()
          4. 2.2.1.4. .has()
          5. 2.2.1.5. .is()
          6. 2.2.1.6. .slice()
          7. 2.2.1.7. .children()
          8. 2.2.1.8. .closest()
          9. 2.2.1.9. .find()
          10. 2.2.1.10. .next(), .nextAll(), and .nextUntil()
          11. 2.2.1.11. .prev(), .prevAll(), and .prevUntil()
          12. 2.2.1.12. .siblings()
          13. 2.2.1.13. .parent()
          14. 2.2.1.14. .parents() and .parentsUntil()
          15. 2.2.1.15. .add()
          16. 2.2.1.16. .andSelf()
          17. 2.2.1.17. .contents()
          18. 2.2.1.18. .end()
        2. 2.2.2. Creating and Inserting DOM Elements
          1. 2.2.2.1. Creating New DOM Elements
          2. 2.2.2.2. Inserting New Elements into the DOM
            1. 2.2.2.2.1. .append() and .prepend()
            2. 2.2.2.2.2. .appendTo() and .prependTo()
            3. 2.2.2.2.3. .after() and .before()
            4. 2.2.2.2.4. .insertAfter() and .insertBefore()
            5. 2.2.2.2.5. .wrap()
            6. 2.2.2.2.6. .unwrap()
            7. 2.2.2.2.7. .wrapAll()
            8. 2.2.2.2.8. .wrapInner()
          3. 2.2.2.3. .remove() and .detach()
        3. 2.2.3. Accessing and Modifying CSS and Attributes
          1. 2.2.3.1. .attr()
          2. 2.2.3.2. .removeAttr()
          3. 2.2.3.3. .css()
            1. 2.2.3.3.1. .text() and .html()
          4. 2.2.3.4. .val()
          5. 2.2.3.5. .data()
          6. 2.2.3.6. .addClass(), .removeClass(), and .toggleClass()
          7. 2.2.3.7. .hasClass()
          8. 2.2.3.8. .height() and .width()
          9. 2.2.3.9. .innerHeight(), .innerWidth(), .outerHeight(), and .outerWidth()
        4. 2.2.4. Affecting Result Sets
          1. 2.2.4.1. .map() and .each()
        5. 2.2.5. Using Animation and Other Effects
          1. 2.2.5.1. .show() and .hide()
          2. 2.2.5.2. .fadeIn(), .fadeOut(), and .fadeTo()
          3. 2.2.5.3. .slideUp(), .slideDown(), and .slideToggle()
          4. 2.2.5.4. .animate()
          5. 2.2.5.5. .delay()
          6. 2.2.5.6. .stop()
        6. 2.2.6. Handling Events
          1. 2.2.6.1. Browser Events
            1. 2.2.6.1.1. .error()
            2. 2.2.6.1.2. .scroll()
          2. 2.2.6.2. Handling Document Loading Events
            1. 2.2.6.2.1. .ready()
            2. 2.2.6.2.2. .unload()
          3. 2.2.6.3. Handling Event Attachment
            1. 2.2.6.3.1. .bind() and .unbind()
            2. 2.2.6.3.2. .live() and .die()
            3. 2.2.6.3.3. .one()
            4. 2.2.6.3.4. .toggle()
            5. 2.2.6.3.5. .trigger()
          4. 2.2.6.4. Shortcut Event Methods
        7. 2.2.7. Using AJAX Controls
          1. 2.2.7.1. $.ajax()
          2. 2.2.7.2. $.ajaxSetup()
          3. 2.2.7.3. Using Shorthand AJAX Methods
            1. 2.2.7.3.1. $.get() and $.post()
            2. 2.2.7.3.2. $.getJSON()
            3. 2.2.7.3.3. $.getScript()
            4. 2.2.7.3.4. .load()
      3. 2.3. Summary
  6. II. Getting Into Advanced PHP Programming
    1. 3. Object-Oriented Programming
      1. 3.1. Understanding Object-Oriented Programming
      2. 3.2. Understanding Objects and Classes
        1. 3.2.1. Recognizing the Differences Between Objects and Classes
        2. 3.2.2. Structuring Classes
        3. 3.2.3. Defining Class Properties
        4. 3.2.4. Defining Class Methods
          1. 3.2.4.1. Using Constructors and Destructors
          2. 3.2.4.2. Converting to a String
        5. 3.2.5. Using Class Inheritance
          1. 3.2.5.1. Overwriting Inherited Properties and Methods
          2. 3.2.5.2. Preserving Original Method Functionality While Overwriting Methods
        6. 3.2.6. Assigning the Visibility of Properties and Methods
          1. 3.2.6.1. Public Properties and Methods
          2. 3.2.6.2. Protected Properties and Methods
          3. 3.2.6.3. Private Properties and Methods
          4. 3.2.6.4. Static Properties and Methods
        7. 3.2.7. Commenting with DocBlocks
      3. 3.3. Comparing Object-Oriented and Procedural Code
        1. 3.3.1. Ease of Implementation
          1. 3.3.1.1. The Procedural Approach
          2. 3.3.1.2. The OOP Approach
        2. 3.3.2. Better Organization
        3. 3.3.3. Easier Maintenance
      4. 3.4. Summary
    2. 4. Build an Events Calendar
      1. 4.1. Planning the Calendar
        1. 4.1.1. Defining the Database Structure
        2. 4.1.2. Creating the Class Map
        3. 4.1.3. Planning the Application's Folder Structure
          1. 4.1.3.1. Public Files
          2. 4.1.3.2. Nonpublic Application Files
        4. 4.1.4. Modifying the Development Environment
          1. 4.1.4.1. Local Development
          2. 4.1.4.2. Remote Development
      2. 4.2. Building the Calendar
        1. 4.2.1. Creating the Database
        2. 4.2.2. Connecting to the Database with a Class
        3. 4.2.3. Creating the Class Wrapper
        4. 4.2.4. Adding Class Properties
        5. 4.2.5. Building the Constructor
          1. 4.2.5.1. Checking the Database Connection
            1. 4.2.5.1.1. Creating a File to Store Database Credentials
          2. 4.2.5.2. Creating an Initialization File
          3. 4.2.5.3. Creating an Index File to Pull It All Together
          4. 4.2.5.4. Setting Basic Properties
        6. 4.2.6. Loading Events Data
          1. 4.2.6.1. Creating an Array of Event Objects for Use in the Calendar
          2. 4.2.6.2. Creating an Event Class
          3. 4.2.6.3. Creating the Method to Store Event Objects in an Array
        7. 4.2.7. Outputting HTML to Display the Calendar and Events
          1. 4.2.7.1. Modifying the Index File
          2. 4.2.7.2. Building the Calendar
          3. 4.2.7.3. Displaying Events in the Calendar
          4. 4.2.7.4. Making the Calendar Look Like a Calendar
          5. 4.2.7.5. Creating the Common Files—Header and Footer
          6. 4.2.7.6. Adding the Files to the Index
        8. 4.2.8. Outputing HTML to Display Full Event Descriptions
          1. 4.2.8.1. Creating a Method to Format Single Event Data
          2. 4.2.8.2. Creating a Method to Generate Markup
          3. 4.2.8.3. Creating a New File to Display Full Events
      3. 4.3. Summary
    3. 5. Add Controls to Create, Edit, and Delete Events
      1. 5.1. Generating a Form to Create or Edit Events
        1. 5.1.1. Adding a Token to the Form
        2. 5.1.2. Creating a File to Display the Form
        3. 5.1.3. Adding a New Stylesheet for Administrative Features
      2. 5.2. Saving New Events in the Database
        1. 5.2.1. Adding a Processing File to Call the Processing Method
        2. 5.2.2. Adding a Button to the Main View to Create New Events
      3. 5.3. Adding Edit Controls to the Full Event View
        1. 5.3.1. Modifying the Full Event Display Method to Show Admin Controls
        2. 5.3.2. Adding the Admin Stylesheet to the Full Event View Page
      4. 5.4. Deleting Events
        1. 5.4.1. Generating a Delete Button
        2. 5.4.2. Creating a Method to Require Confirmation
        3. 5.4.3. Creating a File to Display the Confirmation Form
      5. 5.5. Summary
    4. 6. Password Protecting Sensitive Actions and Areas
      1. 6.1. Building the Admin Table in the Database
      2. 6.2. Building a File to Display a Login Form
      3. 6.3. Creating the Admin Class
        1. 6.3.1. Defining the Class
        2. 6.3.2. Building a Method to Check the Login Credentials
          1. 6.3.2.1. Building a Method to Create Salted Hashes
          2. 6.3.2.2. Creating a Test Method for Salted Hashes
          3. 6.3.2.3. Creating a User to Test Administrative Access
        3. 6.3.3. Modifying the App to Handle the Login Form Submission
      4. 6.4. Allowing the User to Log Out
        1. 6.4.1. Adding a Log Out Button to the Calendar
        2. 6.4.2. Creating a Method to Process the Logout
        3. 6.4.3. Modifying the App to Handle the User Logout
      5. 6.5. Displaying Admin Tools Only to Administrators
        1. 6.5.1. Showing Admin Options to Administrators
          1. 6.5.1.1. Modifying the General Admin Options Method
          2. 6.5.1.2. Modifying the Event Options Method
        2. 6.5.2. Limiting Access to Administrative Pages
          1. 6.5.2.1. Disallowing Access to the Event Creation Form Without Login
          2. 6.5.2.2. Ensuring Only Logged In Users Can Delete Events
      6. 6.6. Summary
  7. III. Combining jQuery with PHP Applications
    1. 7. Enhancing the User Interface with jQuery
      1. 7.1. Adding Progressive Enhancements with jQuery
        1. 7.1.1. Setting Progressive Enhancement Goals
      2. 7.2. Include jQuery in the Calendar App
        1. 7.2.1. Create a JavaScript Initialization File
          1. 7.2.1.1. Include the Initialization File in the Application
          2. 7.2.1.2. Ensuring the Document Is Ready Before Script Execution
        2. 7.2.2. Creating a New Stylesheet for Elements Created by jQuery
          1. 7.2.2.1. Including the Stylesheet in the Index File
      3. 7.3. Creating a Modal Window for Event Data
        1. 7.3.1. Binding a Function to the Click Event of Title Links
        2. 7.3.2. Preventing the Default Action and Adding an Active Class
        3. 7.3.3. Extracting the Query String with Regular Expressions
          1. 7.3.3.1. Using the Lazy Approach: String-Based Replacement
          2. 7.3.3.2. Adopting a Better Solution: Regular Expressions
          3. 7.3.3.3. Incorporating a Regular Expression into a Script
        4. 7.3.4. Creating a Modal Window
          1. 7.3.4.1. Creating the Utility Function to Check for a Modal Window
          2. 7.3.4.2. Calling the Utility Function from the Event Handler
        5. 7.3.5. Retrieve and Display Event Information with AJAX
          1. 7.3.5.1. Creating a File to Handle AJAX Requests
          2. 7.3.5.2. Loading Event Data Using AJAX
        6. 7.3.6. Add a Close Button
        7. 7.3.7. Add Effects to the Creation and Destruction of the Modal Window
          1. 7.3.7.1. Fade Out the Modal Window
          2. 7.3.7.2. Adding an Overlay and Fade in the Modal Window
      4. 7.4. Summary
    2. 8. Editing the Calendar with AJAX and jQuery
      1. 8.1. Opening the Event Creation Form
        1. 8.1.1. Adding an AJAX Call to Load the Form
        2. 8.1.2. Modifying the AJAX Processing File to Load the Form
        3. 8.1.3. Making the Cancel Button Behave Like the Close Button
      2. 8.2. Saving New Events in the Database
        1. 8.2.1.
          1. 8.2.1.1. Serializing the Form Data
          2. 8.2.1.2. Submitting the Serialized Form Data to the Processing File
        2. 8.2.2. Modifying the AJAX Processing File to Handle New Submissions
      3. 8.3. Adding Events Without Refreshing
        1. 8.3.1. Deserializing the Form Data
          1. 8.3.1.1. Decode Any URL-Encoded Characters in Form Values
          2. 8.3.1.2. Bring It All Together
        2. 8.3.2. Creating Date Objects
          1. 8.3.2.1. Modifying the Calendar Class with an ID
          2. 8.3.2.2. Building Date Objects in JavaScript
          3. 8.3.2.3. Fixing Timezone Inconsistencies
          4. 8.3.2.4. Ensuring the Event Occurs in the Current Month
        3. 8.3.3. Appending the Event to the Calendar
        4. 8.3.4. Getting the New Event's ID
          1. 8.3.4.1. Modifying the Event Creation Method to Return New Event IDs
      4. 8.4. Editing Events in a Modal Window
        1. 8.4.1. Determining the Form Action
        2. 8.4.2. Storing the Event ID if One Exists
          1. 8.4.2.1. Adding the Event ID to the Query String
        3. 8.4.3. Remove Event Data from the Modal Window
        4. 8.4.4. Ensuring Only New Events Are Added to the Calendar
      5. 8.5. Confirming Deletion in a Modal Window
        1. 8.5.1. Displaying the Confirmation Dialog
        2. 8.5.2. Configuring the Form Submission Event Handler for Deletion
          1. 8.5.2.1. Modifying the Processing File to Confirm Deletion
        3. 8.5.3. Remove the Event from the Calendar After Deletion
          1. 8.5.3.1. Modifying the Form Submission Handler to Remove Deleted Events
      6. 8.6. Summary
  8. IV. Advancing jQuery and PHP
    1. 9. Performing Form Validation with Regular Expressions
      1. 9.1. Getting Comfortable with Regular Expressions
        1. 9.1.1. Understanding Basic Regular Expression Syntax
          1. 9.1.1.1. Setting up a Test File
          2. 9.1.1.2. Replacing Text with Regexes
          3. 9.1.1.3. Choosing Regexes vs. Regular String Replacement
        2. 9.1.2. Drilling Down on the Basics of Pattern Modifiers
        3. 9.1.3. Getting Fancy with Backreferences
        4. 9.1.4. Matching Character Classes
          1. 9.1.4.1. Matching Any Character Except...
          2. 9.1.4.2. Using Character Class Shorthand
        5. 9.1.5. Finding Word Boundaries
        6. 9.1.6. Using Repetition Operators
        7. 9.1.7. Detecting the Beginning or End of a String
        8. 9.1.8. Using Alternation
        9. 9.1.9. Using Optional Items
        10. 9.1.10. Putting It All Together
      2. 9.2. Adding Server-Side Date Validation
        1. 9.2.1. Defining the Regex Pattern to Validate Dates
          1. 9.2.1.1. Setting up Test Data
          2. 9.2.1.2. Matching the Date Format
        2. 9.2.2. Adding a Validation Method to the Calendar Class
        3. 9.2.3. Returning an Error if the Dates Don't Validate
      3. 9.3. Adding Client-Side Date Validation
        1. 9.3.1. Creating a New JavaScript File to Validate the Date String
        2. 9.3.2. Including the New File in the Footer
        3. 9.3.3. Preventing the Form Submission if Validation Fails
      4. 9.4. Summary
    2. 10. Extending jQuery
      1. 10.1. Adding Functions to jQuery
        1. 10.1.1. Adding Your Date Validation Function to jQuery
          1. 10.1.1.1. Allowing Custom Aliases in jQuery Plugins
          2. 10.1.1.2. Attaching the Function to the jQuery Object
          3. 10.1.1.3. Allowing Configurable Options
          4. 10.1.1.4. Extending Default Options with User-Supplied Options
          5. 10.1.1.5. Performing Validation and Returning a Value
          6. 10.1.1.6. Conforming to jQuery Plugin File Naming Conventions
        2. 10.1.2. Modifying the Include Script
        3. 10.1.3. Modifying the Initialization Script
      2. 10.2. Adding Methods to jQuery
        1. 10.2.1. Building Your Plugin
          1. 10.2.1.1. Creating a Properly Named Plugin File
          2. 10.2.1.2. Providing Publicly Accessible Default Options
          3. 10.2.1.3. Maintaining Chainability
          4. 10.2.1.4. Creating a Publicly Accessible Helper Method
          5. 10.2.1.5. Modifying Each Matched Element
        2. 10.2.2. Implementing Your Plugin
          1. 10.2.2.1. Including the Plugin File
          2. 10.2.2.2. Initializing the Plugin on a Set of Elements
      3. 10.3. Summary

Product information

  • Title: Pro PHP and jQuery
  • Author(s): Jason Lengstorf
  • Release date: June 2010
  • Publisher(s): Apress
  • ISBN: 9781430228479