Award-winning web development since 1995
Written: September 3, 2011
Unfortunately I do have a client that started with Yahoo Small Business for his web hosting and we have been using WordPress so that he can make his own updates.
The issue we have now run up against is that WordPress 3.2.1 requires PHP 5 and MySQL 5 to work. Yahoo is only half-way there on supporting this because PHP 5 is allowed while MySQL 5 is not yet supported. So we are stuck using an old version of WordPress which makes our site susceptible to hacking, not something that you want to risk when running a business and depending on your web site to always be up and running.
When you search other blogs about this the reply is uniform, “Yahoo Small Business” is far behind the times and will not commit to a date for supporting the most popular blogging and web CMS platform in the world.
Sad, but true. You have been warned.
I recommend hosting with 1and1 instead, they are up with the times, support the latest WordPress, have excellent up-time, the control panel is intuitive and real people answer the phone to support you.
PPI is a client that organizes several annual events with online registration. Jules at PPI asked me to look into automating the process for companies that are returning again this year so they don’t have to re-type so much information again.
I did some searching on Google and found a solution that uses jQuery, then another site that showed how to integrate that with a MySQL database.
Here’s what the visitor sees when they register:
As they type in their company name like “canon” they see a list of possible matches:
They click the matched name “Canon” and the next 8 fields are auto-filled:
Coding
Adding this new feature required that I add jQuery and CSS in the HEAD of my page and define which fields should be auto-filled:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script> <script type="text/javascript"> $(function() { $("#company").autocomplete({ source: "test_company.php", minLength: 2, select: function(event, ui) { $('#address').val(ui.item.address); $('#city').val(ui.item.city); $('#state').val(ui.item.state); $('#zip').val(ui.item.zip); $('#phone').val(ui.item.phone); $('#email').val(ui.item.email); $('#first_name').val(ui.item.first_name); $('#last_name').val(ui.item.last_name); } }); }); </script> |
On line 9 I used #company as the name of the input field where a visitor types the company name.
The connection to the database with all of the company info stored is defined on line 10 as “test_company.php”.
Lines 13 thru 20 have the eight field names that I want to auto fill in my form.
The HTML for each field uses the same ID just defined in the Javascript listed above:
1 2 3 |
The connection to the MySQL database is defined in the file “test_company.php”:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | <? /* Connection to the database. */ include 'database.php'; $return_arr = array(); /* If connection to database, run sql statement. */ $fetch = mysql_query("SELECT * FROM ppigolf WHERE company LIKE '%" . mysql_real_escape_string($_GET['term']) . "%'"); /* Retrieve and store in array the results of the query.*/ while ($row = mysql_fetch_array($fetch) ) { $row_array['address'] = $row['address']; $row_array['city'] = $row['city']; $row_array['state'] = $row['state']; $row_array['zip'] = $row['zip']; $row_array['phone'] = $row['phone']; $row_array['email'] = $row['email']; $row_array['first_name'] = $row['first_name']; $row_array['last_name'] = $row['last_name']; $row_array['value'] = $row['company']; array_push($return_arr,$row_array); } /* Free connection resources. */ mysql_close(); /* Toss back results as json encoded array. */ echo json_encode($return_arr); ?> |
Line 20 is where I define that “company” is the ID being typed by the web visitor and is requires the array key of “value”. For simplicity I named my form fields the same as my database table fields.
Enjoy automating your registration forms and using auto-fill to speed up the process.
Tags: autocomplete, jQuery, json, MySQL, PHPI’m getting ready to do formal portraits at a corporate party in March so I’d like to share with you how I’ve automated my workflow to better serve clients. Here are my work flow objectives:
To achieve these objectives I’ve assembled the following technologies:
Here’s how the computers and camera are all connected:
I’m a geeky guy so I wrote my own Applescript to re-size and copy images, plus the proofing and order system was written with PHP, MySQL, Javascript, Dreamweaver and Photoshop.
My web server on the PC is using the popular XAMPP tools, which are Open Source.
Shooting
I operate my Canon 5D just like always, on full manual with custom white balance, everything metered so there are no surprises. Using the USB2.0 cable it takes about 6 seconds for an image to go from the camera to the iMac. I shoot JPEG for event photos to save time and they look just great.
Applescript
This script takes about 5 seconds to re-size the full-size image into a proof and thumbnail size images, then copies them over to a folder on the PC where the web server is running.
Proofing and Ordering
The client uses a web browser to see their proofs. At first they see thumbnails. Clicking a thumbnail brings up a larger image with a price list.
Post Event
When I arrive back home after the event, then I run another web page to take my batch credit card orders and process them. Yes, I wrote that one too.
Summary
I’ve been able to achieve my event photography work flow objectives by using some standard technology and some custom technology to get the job done. My clients can be photographed, proof and order in a few minutes. They’re happy and I’m busy sending orders to my lab and then delivering prints to clients.
Chris Roane says: Hi,
I love the article and your blog. Would you be interested in exchanging links with me? My website is http://www.montanaprogrammer.com/ . Please let me know!
Linda, CEO of the Tualatin Chamber contacted me recently about sprucing up their web site with a new look. She liked the colors light blue and navy blue, and wanted to see more variety visually. Here’s what I changed:
This site uses my custom Content Management System, which provides an easy way to update content, add events, manage members, accept payments, send emails, display banner ads and allow members to update their own profile or add events, jobs and special offers.
I had the pleasure of launching a new client site this week for the Sherwood Chamber of Commerce:
©2020 Tualatin Web LLC. All rights reserved. |
Payment |
Web Hosting |
Privacy |
Could you please upload your code? I really need this code in my project .
The code is already posted in the blog. Are you a developer or just a web user? This code is meant for someone that knows how to program with: jQuery, CSS, HTML, PHP and MySQL.
I’m a developer, a beginner . I try to run your code after adjusting several places (where necessary) but I couldn’t get the same result as posted here .
I’m available for hire at $75.00/hour to make this work on your web site. Are you using any CMS like WordPress, Drupal, Joomla, etc.?
No, it’s just a school project. Thank you for the offer but I just have to figure it out myself.