Address Book Edit a Contact

This page is a tutorial on an app page that you use to edit a contact in your address book. You will be entering data in some or all of 23 different fields. To be able to save, make sure you enter an email address into both email address fields. But if you know only one, enter it twice. If you know none, enter a@a.com or something equally harmless but do try to obtain an email address or two on this contact. The data will save if you enter nothing else but the 2 emails, but what's the point of not taking the task seriously. It's YOUR address book!

Here are the field choices (both email addresses are required fields, but if you need to fake it, z@z.com is fine):

id
First
Middle
Last
Address1
Address2
City
State
Zip
Email1
Email2
CelPhone
WorkPhone
HomePhone
Fax
RelationshipType
RelationshipSpecific
AssistantAssociate
ReferredBy
Website
Blog
Facebook
Twitter
Notes

Here are the Relationship Types you can choose from when you add a new contact:

Friend
Acquaintance
Professional
Client
Group Member
Business Associate

Let's look at the script. First, the JavaScript: The textCounter() function is for the textarea box input in the form which allows input of up to 400 characters in the Notes field. This function not only shows a counter of the number of characters which you have left out of 400. Once you hit 0, the textarea box prevents entering any more characters. This is like the maxlength attribute for regular text input tags. This attribute cannot apply to textarea boxes—it doesn't work. So this function is a way to make up for this problem.

Then comes the email validator—still JavaScript. Note that there can be a lot of stuff in a legitimate email, but even though we were liberal on construction, we were a stickler for which characters are in it. Bad email addresses will be caught and you will be asked to fix them before you can save. (So fun@notfun is no good, nor is silly@sillier.silliest, and don't even get us started on discussing sticker@dollar$sign.rich). Note the document.form1.Email1.focus() and document.form1.Email2.focus() codes. These force the cursor back to an email address field in which a bad entry is discovered, since the code says "in the form form1 and the input box Email1 (or Email2) we will now go use the focus() function to stick the cursor there."

On to the PHP codes: After getting ready to access the MySQL database by using the include with config.php in it, we define several form input filtering functions. The filteritless() function is used to filter the Notes field only, since who knows what one might put there? The filterit() function is used to filter most of the 23 fields, like names, addresses, phone numbers, etc. The url() function is used to filter Website, Blog, Facebook, and Twitter fields, and the email() function is used to filter Email1 and Email2 fields. In the email() function, the PHP function preg_match() is used with a regular expression and a standard email pattern. If a bad email is found, you are forced to start over with the input. Happily, the email validator in the JavaScript function has already been run on the email due to the onsubmit() event in the form, so the email has already been cleaned and the PHP email() function finding a naughty means someone's trying to pull a fasty by turning off JavaScript while entering data. For shame! The PHP preg_replace() function is used in the other three functions to simply dump any unacceptable character. Note that in all these PHP functions, the mysql_real_escape_string() function is used on all data before inserting it into the MySQL database table for security reasons.

Now the $_GET and $_POST functions are used to see if the id of the record being edited is available as it's supposed to be at this point. If it's not detected by either function, the user is sent to the home page. The reason we use both functions is the id value will have gotten sent by URL query string from either the Address Book Sort Contacts By Name or Address Book Sort Contacts By Type page, OR it will have gotten POSTed to the page from a hidden field in the form lower down in the page (i.e., the page sends itself data). How does this form know the correct id to send? A JavaScript section after the form uses JSON (JavaScript Object Notation) to get the PHP value $id and turn it into the JavaScript value id, then we stick the id into the form's hidden field using dot notation. Why do we need the form to POST this id value to the page? Because once the editing is done and the form is submitted, it submits it to this editing page and this page reload will throw away all known values except those POSTed to the page during the reload. If we do not know the id, how will we know what record to update? POSTing cures this ignorance.

These same functions in the JavaScript section after the form are used to insert values into the HTML Select tag and textarea box. The RelationshipType Select tag uses the selectedIndex property to get the right dropdown box option showing. Since the script GETs only an id, from the URL query string, where does it get this value? First it puts the option values into the $op array. Then it uses the MySQL SELECT statement to get the record's data into the $a array. It uses the PHP function stripslashes() to remove \ characters inserted when the record data used mysql_real_escape_string() to keep it safe to put into MySQL. Then the 16th $a array element ($a[15]) where RelationshipType lives is compared with the $op array and the element number of the matching array value is saved in $si. This, then, is the selectedIndex value stuck into the RelationshipType select box on this page.

The textarea box cannot get its value inserted the way we insert them for the input boxes (e.g., value="<? echo $a[1]; ?>"). Search forever to find a "value" attribute in the textarea specs on the HTML textarea tag page at W3Schools. The value goes between the opening and closing tag, but our attempts to stick it there via PHP failed, but our JSON efforts were richly rewarded when we used var a = <?php echo json_encode($a); ?> and document.form1.Notes.value=a[23]; in our final JavaScript section. The entire $a array is put into a JavaScript a[] array. Note that JavaScript accesses a value attibute that textarea doesn't even have. Magic?

Another hidden field POSTs the value "s" as a flag (name of hidden field) and the activity of the last paragraph does not happen unless the submission has NOT occurred, since we have to load the input boxes BEFORE the form is submitted, obviously. If the value of the flag is "s" we go on to filter the form inputs and UPDATE the MySQL database table, as shown after }else{.

You could add code here to check the addressbook table for the First and Last names you are submitting. If it finds them, you are restarted. You do not want duplicate names in your addressbook table. We left this out because to get here you had to be on the home page where the records were sorted by last name and all names have already been validated as unique in the add contact function of our address book. Why would you change a name that is unique presently to a duplicate name if you're not nutty as a Baby Ruth candy bar?

Now we use the UPDATE statement to update our MySQL database table with the record data just entered in the form. The id field is dealt with by use of a WHERE id='$id' clause, since you are updating only one record. You get a message if the saving was okay, and the page reloads to accept more input.

Finally, there is the form. It uses the onsubmit() event to trap bad emails, maxlength attributes to limit input, the textCounter() function to limit textarea box input, and there is a button that allows you to quit and return to the home page, which is: Address Book Sort Contacts By Name. We've already discussed how we used the GETted id to know the record to load into the $a array which we update the input box values with via PHP.

On to the code for the script. Name the following: address-book-edit.php

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1252">
<TITLE>PHP Address Book — Edit Contact</TITLE>
<meta name="description" content="PHP Address Book — Edit Contact">
<meta name="keywords" content="PHP Address Book,PHP Address Book - Edit Contact,Content Management System,cms,javascript, dhtml, DHTML">
<style type="text/css">
BODY {margin-left:0; margin-right:0; margin-top:0;}
p, li, td {font:13px Verdana; color:black;}
h1 {font:bold 28px Verdana; color:black;text-align:center}
h2 {font:bold 24px Verdana;text-align:center}
h3 {font:bold 15px Verdana;}
.address {position:absolute; left:50px; top:70px; width:900px; margin:0; padding:10px; background-color:#cccccc; border:2px solid #000; font:bold 11px Verdana;}
.r (text-align:right;}
.l (text-align:left;}
.c (text-align:center;}
</style>
<SCRIPT LANGUAGE="JavaScript">

</script>
</head>
<body>
<?php
include_once"../config.php";

function filteritless(){
global $S;
$S=strip_tags($S);
$pattern = '/[^a-zA-Z0-9\\s\\.\\,\\!\\;\\-\\_\\"\\?\\047\\:\$\$\\&\\#\\=\\@\\/\\%]/i';
$replacement = '';
$S=preg_replace($pattern, $replacement, $S);
$S=mysql_real_escape_string($S);}

function filterit(){
global $S;
$S=strip_tags($S);
$pattern = '/[^a-zA-Z0-9\\s\\.\\,\\-\\_\$\$\\#\\047]/i';
$replacement = '';
$S=preg_replace($pattern, $replacement, $S);
$S=mysql_real_escape_string($S);}

function email(){
global $S;
$S = strip_tags($S);
if (!preg_match("/([\w\-]+\@[\w\-]+\.[\w\-]+)/",$S)) {
echo '<script language="javascript">alert("That email address is not valid."); window.location = "address-book-edit.php"; </script>';}
$S=mysql_real_escape_string($S);}

function url(){
global $S;
$S = strip_tags($S);
$pattern = '/[^a-zA-Z0-9\\.\\,\\!\\;\\-\\_\\*\\@\\=\\+\\$\\/\\&\\[\\]\\#\\?\\047\\:\$\$]/i';
$replacement = '';
$S=preg_replace($pattern, $replacement, $S);
$S=mysql_real_escape_string($S);}

$id=$_GET['id']; if(!isset($id)){$id=$_POST['id'];if(!isset($id)){echo '<script language="javascript">alert("Start from Home page."); window.location = "address-book-sort-by-name.php"; </script>';}}
$flag=$_POST['flag']; if($flag<>"s"){
$a=array();$op=array("Friend","Acquaintance","Professional","Client","Group Member","Business Associate");
$res = mysql_query("SELECT * FROM addressbook WHERE id='$id'") or die(mysql_error());
$row = mysql_fetch_row($res);
for ($i = 0; $i < 24; $i++) {$a[$i]=stripslashes($row[$i]);}
for ($i=0;$i<6;$i++) {if($op[$i]==$a[15]){$si=$i;}}

}else{

$First = $_POST['First'];$S=$First;filterit();$First=$S;
$Middle = $_POST['Middle'];$S=$Middle;filterit();$Middle=$S;
$Last = $_POST['Last'];$S=$Last;filterit();$Last=$S;
$Address1 = $_POST['Address1'];$S=$Address1;filterit();$Address1=$S;
$Address2 = $_POST['Address2'];$S=$Address2;filterit();$Address2=$S;
$City = $_POST['City'];$S=$City;filterit();$City=$S;
$State = $_POST['State'];$S=$State;filterit();$State=$S;
$Zip = $_POST['Zip'];$S=$Zip;filterit();$Zip=$S;
$Email1 = $_POST['Email1'];$S=$Email1;email();$Email1=$S;
$Email2 = $_POST['Email2'];$S=$Email2;email();$Email2=$S;
$CelPhone = $_POST['CelPhone'];$S=$CelPhone;filterit();$CelPhone=$S;
$WorkPhone = $_POST['WorkPhone'];$S=$WorkPhone;filterit();$WorkPhone=$S;
$HomePhone = $_POST['HomePhone'];$S=$HomePhone;filterit();$HomePhone=$S;
$Fax = $_POST['Fax'];$S=$Fax;filterit();$Fax=$S;
$RelationshipType = $_POST['RelationshipType'];
$RelationshipSpecific = $_POST['RelationshipSpecific'];$S=$RelationshipSpecific;filterit();$RelationshipSpecific=$S;
$AssistantAssociate = $_POST['AssistantAssociate'];$S=$AssistantAssociate;filterit();$AssistantAssociate=$S;
$ReferredBy = $_POST['ReferredBy'];$S=$ReferredBy;filterit();$ReferredBy=$S;
$Website = $_POST['Website'];$S=$Website;url();$Website=$S;
$Blog = $_POST['Blog'];$S=$Blog;url();$Blog=$S;
$Facebook = $_POST['Facebook'];$S=$Facebook;url();$Facebook=$S;
$Twitter = $_POST['Twitter'];$S=$Twitter;url();$Twitter=$S;
$Notes = $_POST['Notes'];$S=$Notes;filteritless();$Notes=$S;

mysql_query("UPDATE addressbook SET First='$First', Middle='$Middle', Last='$Last', Address1='$Address1', Address2='$Address2', City='$City', State='$State', Zip='$Zip', Email1='$Email1', Email2='$Email2', CelPhone='$CelPhone', WorkPhone='$WorkPhone', HomePhone='$HomePhone', Fax='$Fax', RelationshipType='$RelationshipType', RelationshipSpecific='$RelationshipSpecific', AssistantAssociate='$AssistantAssociate', ReferredBy='$ReferredBy', Website='$Website', Blog='$Blog', Facebook='$Facebook', Twitter='$Twitter', Notes='$Notes' WHERE id='$id'") or die('Error ,saving failed');
$rc = mysql_affected_rows();
if ($rc>0){unset($First);unset($Last);
echo '<script language="javascript">alert("The saving was successfully accomplished.");window.location="address-book-sort-by-name.php"; </script>';}
else{echo '<script language="javascript">alert("The saving was unsuccessful.");</script>';}
}

mysql_close();

if($flag<>"s"){
?>

<center><h1>PHP Address Book — Edit Contact</h1></center>
<div class="address"><form name="form1" action="address-book-edit.php" method="post" onsubmit="return email()">
<table>
<tr><td class='r' align=right>First Name:</td><td class='l'>
<input type="text" name="First" maxlength="20" size="20" value="<? echo $a[1]; ?>">
<td class='r' align=right>Middle Name:</td><td>
<input type="text" name="Middle" maxlength="20" size="20" value="<? echo $a[2]; ?>">
<td class='r' align=right>Last Name:</td><td>
<input type="text" name="Last" maxlength="20" size="20" value="<? echo $a[3]; ?>"></td></tr>
<tr><td class='r' align=right>Address 1:</td><td colspan="5" class='l'>
<input type="text" name="Address1" maxlength="40" size="40" value="<? echo $a[4]; ?>"></td></tr>
<tr><td class='r' align=right>Address 2:</td><td colspan="5" class='l'>
<input type="text" name="Address2" maxlength="40" size="40" value="<? echo $a[5]; ?>"></td></tr>
<tr><td class='r' align=right>City:</td><td colspan="5" class='l'>
<input type="text" name="City" maxlength="40" size="40" value="<? echo $a[6]; ?>"></td></tr>
<tr><td class='r' align=right>State:</td><td colspan="5" class='l'>
<input type="text" name="State" maxlength="10" size="10" value="<? echo $a[7]; ?>"></td></tr>
<tr><td class='r' align=right>Zip:</td><td colspan="5" class='l'>
<input type="text" name="Zip" maxlength="10" size="10" value="<? echo $a[8]; ?>"></td></tr>
<tr><td class='r' align=right>Email 1:</td><td colspan="5" class='l'>
<input type="text" name="Email1" maxlength="90" size="90" value="<? echo $a[9]; ?>"></td></tr>
<tr><td class='r' align=right>Email 2:</td><td colspan="5" class='l'>
<input type="text" name="Email2" maxlength="90" size="90" value="<? echo $a[10]; ?>"></td></tr>
<tr><td class='r' align=right>Cel Phone:</td><td colspan="5" class='l'>
<input type="text" name="CelPhone" maxlength="20" size="20" value="<? echo $a[11]; ?>"></td></tr>
<tr><td class='r' align=right>Work Phone:</td><td colspan="5" class='l'>
<input type="text" name="WorkPhone" maxlength="20" size="20" value="<? echo $a[12]; ?>"></td></tr>
<tr><td class='r' align=right>Home Phone:</td><td colspan="5" class='l'>
<input type="text" name="HomePhone" maxlength="20" size="20" value="<? echo $a[13]; ?>"></td></tr>
<tr><td class='r' align=right>Fax:</td><td colspan="5" class='l'>
<input type="text" name="Fax" maxlength="20" size="20" value="<? echo $a[14]; ?>"></td></tr>
<tr><td class='r' align=right>Relationship Type:</td><td colspan="5" class='l'>
<select name="RelationshipType">
<option value="Friend">Friend
<option value="Acquaintance">Acquaintance
<option value="Professional">Professional
<option value="Client">Client
<option value="Group Member">Group Member
<option value="Business Associate">Business Associate
</select>
</td></tr>
<tr><td class='r' align=right>Relationship Specific:</td><td colspan="5" class='l'>
<input type="text" name="RelationshipSpecific" maxlength="90" size="90" value="<? echo $a[16]; ?>"></td></tr>
<tr><td class='r' align=right>Assistant/Associate:</td><td colspan="5" class='l'>
<input type="text" name="AssistantAssociate" maxlength="40" size="40" value="<? echo $a[17]; ?>"></td></tr>
<tr><td class='r' align=right>Referred By:</td><td colspan="5" class='l'>
<input type="text" name="ReferredBy" maxlength="40" size="40" value="<? echo $a[18]; ?>"></td></tr>
<tr><td class='r' align=right>Website:</td><td colspan="5" class='l'>
<input type="text" name="Website" maxlength="90" size="90" value="<? echo $a[19]; ?>"></td></tr>
<tr><td class='r' align=right>Blog:</td><td colspan="5" class='l'>
<input type="text" name="Blog" maxlength="90" size="90" value="<? echo $a[20]; ?>"></td></tr>
<tr><td class='r' align=right>Facebook:</td><td colspan="5" class='l'>
<input type="text" name="Facebook" maxlength="90" size="90" value="<? echo $a[21]; ?>"></td></tr>
<tr><td class='r' align=right>Twitter:</td><td colspan="5" class='l'>
<input type="text" name="Twitter" maxlength="90" size="90" value="<? echo $a[22]; ?>"></td></tr>
<tr><td class='r' align=right>Notes:</td><td colspan="5" class='l'>
<textarea name="Notes" id='Notes' cols="80" rows="5" onKeyDown="textCounter(this.form.Notes,this.form.remLen,400)" onKeyUp="textCounter(this.form.Notes,this.form.remLen,400)"></textarea><input readonly type='text' name='remLen' size='3' maxlength='3' value="400">
<input type='hidden' name='flag' value="s"><input type='hidden' name='id' value=''></td></tr>
<tr><td colspan="2"> </td><td colspan="2"><input name="Submit" type="submit" value="Edit Contact">   <button type="button" onclick="javascript:window.location='address-book-sort-by-name.php'">Home</button></td><td colspan="2"> </td></tr>
</table></form></div>

<script language="javascript">

</script>

<?php
}
?>

</body>
</html>

Free Personal Status Boards (PSB™)

Address Book Edit a Contact