Opinions, Interesting Facts, and How to on Software, Social Media, PHP, MYSQL, jQuery, AJAX, CSS, XHTML, Wordpress Theming, and Web 2.0 Development

ExpressionEngine2 Hooks for New Relic

recently I started using New Relic to monitor some of our larger web apps, and I have to say it is AWESOME! but did lack a smooth (and manageable during upgrades) integration with EE2, so I created a little hook as a starting point for what will likely turn into a more down the road.

The main issue is tracking the URL paths in the transactions, New Relic simply sees the EE/index… Not enough info! so here’s how to fix that.

In your expressionengine/config/config.php file set:

$config['enable_hooks'] = TRUE;

In your expressionengine/config/hooks.php file add:

$hook['post_controller_constructor'] = array('class' => 'Newrelic',
	'function' => 'name_transaction',
	'filename' => 'newrelic.php',
	'filepath' => 'hooks'
);

Create the file expressionengine/hooks/newrelic.php and add the following code:

< ?php if (!defined('BASEPATH')) exit('No direct script access allowed');
class Newrelic
{
	public function name_transaction()
	{
		if (extension_loaded('newrelic')){
			$newrelic_transaction = implode('/', ee()->uri->segments);
			newrelic_name_transaction($newrelic_transaction);
		}
	}
}

And that’s it, you’re done! what this basically does is grab all url segments and report them. I haven’t found the need for any more hooks (yet) but if they come up I’ll add them here.

Twitter feed on your website using PHP (the easy way)

Edit: This method no longer works! Twitter has updated their API and now require authentication to fetch feeds.

So I was searching around for a while for a php script to let me grab a twitter feed and format it. I found a couple that I felt did too much work for so little.. so I decided to look into creating my own script to do it and here it is.

$twitterFeed = json_decode(file_get_contents("https://twitter.com/statuses/user_timeline/jubairsaidi.json?count=5"));
if($twitterFeed){
     foreach($twitterFeed as $t) {
          $tweetText = preg_replace('#\b(([\w-]+://?|www[.])[^\s()<>]+(?:\([\w\d]+\)|([^[:punct:]\s]|/)))#','<a href="$1">$1</a>', $t->text);
          $tweetText = preg_replace('/(^|\s)@([a-z0-9_]+)/i','$1<a href="http://www.twitter.com/$2">@$2</a>', $tweetText);
          echo '<p>'.$tweetText.'</p>';
          echo '<p><em>'.date('G:i F jS',strtotime($t->created_at)).'</em></p><br/>';
     }
}else{
  echo 'this feed is not available at this time';
}

Basically what i am doing here is grabbing the contents of my twitter feed by using my user name (jubairsaidi) and saying I want the json version and limit it to only 5 posts. on the same line I am using the json_decode function which basically takes a json object and converts it into a php object. Once I have this, I loop through the data (it will return 5 objects in an indexed array) I first check to see if there are any links in the tweet text and if there are I convert the link text to a actual link, then I check if there are any mentions (which doing it this way includes replies) in the tweet and make those links to that user’s twitter account, and finally I echo out the text from the post. Keep in mind that there is a lot more data to play with.. once you bring the data over and convert it to a php object, you can work with it like anything else.

Installing Facebook PHP SDK as a Library in CodeIgniter

So I searched all over the net and couldn’t really find the answer to a simple question… how do you integrate Facebook’s PHP SDK AS IS as a Library in CodeIgniter?

There are a lot of great libraries out there that add their own functionality as well as integrate, but it’s not something I was looking to do really.. the default functionality was enough.

Anyway here’s how to do this. first go here:
http://github.com/facebook/php-sdk/

download the latest version and upload the 3 files facebook.php base_facebook.php and fb_ca_chain_bundle.crt to your application/libraries/ directory.

Now rename facebook.php to Facebook.php

Now create a file in your application/config/ folder called: facebook.php

in this file you should have the following:

< ?php  
if ( ! defined('BASEPATH')) exit('No direct script access allowed'); 
$config['appId']		= 'your_app_id'; 
$config['secret']	= 'your_app_secret'; 
$config['canvas']	= true; 

Ok now save that file and open up in that same dir (application/config/) open: autoload.php and then look for: $autoload['libraries']

Add to this array ‘facebook’ so it should look like this:

$autoload['libraries'] = array('database','session','facebook');

Do keep in mind that in this case I am also loading the database and session libraries.

Once you do this, you can simply call $this->facebook to access your Facebook Library Class.

Note: DO NOT add facebook to $autoload['config'] = array();

I made this mistake and took me some time trying to figure out why it wasn’t working properly.

we have .serialize() we have .serializeArray() and we have .serializeObject()

When working on one of my apps, I needed to be able to serialize multiple forms and send them off to be processed via ajax call, however not in every situation there are the same number of forms.. they are dynamically created based on certain conditions (say multiple user create submission as an example). so what I needed was a method of serializing all the forms and accessing the data effectivly. I could have easilly done this in php but figured it would be ‘nicer’ if I could do it before sending it to the processing script. so I found this: http://stackoverflow.com/questions/1184624/serialize-form-to-json-with-jquery (I know, gotta love Stack OverFlow right?)

$.fn.serializeObject = function()
	{
	    var o = {};
	    var a = this.serializeArray();
	    $.each(a, function() {
	        if (o[this.name] !== undefined) {
	            if (!o[this.name].push) {
	                o[this.name] = [o[this.name]];
	            }
	            o[this.name].push(this.value || '');
	        } else {
	            o[this.name] = this.value || '';
	        }
	    });
	    return o;
	};

accidentally locked Adium out of facebook via account security (the fix)

For as long as I have used Adium, I enjoyed being able to add my Facebook chat account to it so that I can use one central place for all things chat. A few months ago, I logged into my Facebook Account Security screen and noticed there were some logins from an unknown source. So naturally I went in and clicked “End Activity” (big mistake!) turns out that activity was Adium! so thus I permanently locked my self out of being able to log in to Facebook via Adium.. keep in mind that this was using the default Facebook account type in Adium account type list (it has a Facebook chat connect plugin).

Then I started the search online.. looking for a way to remove a device that I accidentally blocked. Turns out, there is no way to do it!! I kept doing my research and then found out today that you can actually add access to Facebook chat using Jabber! Boy was this a life saver! I can now connect again to facebook chat using Adium.
The visual how to:

where you see the words blurred out, you type in your Facebook username. i.e. the one you set up a long time ago at http://www.facebook.com/username

People looking for ways to hack Facebook like buttons?

I was looking at my google analytics data for this blog the other day and noticed there were a decent amount of hits for the search string ‘Facebook like hack’ and similar search strings. I was getting these hits to my blog post about how to add the Facebook like button to your IPB forum posts via bbcode and a little creative JavaScript modification.

When searching for the term, I found only one other article about avoiding Facebook like button hacks designed to steal personal info, but not much else. Heh, maybe that’s why i am getting so many hits on this search.

Seems there might be an increase on hacking attempts? Or maybe it’s just that I have risen in rank for that search term (or both). Either way, it will be interesting to see if Facebook does get a problem with a Facebook like button hack (though I hope it doesn’t happen heh).

Passing Multidimensional arrays between two servers

For a long time I was using JSONP to accomplish this, until I figured out a nifty function called json_encode() and of course it’s sister function json_decode().

The key here is to combine them with ob_start() function which allows you to capture raw output and dump it into a variable.

here’s how it works:

on remote server test.php file:

$array = array('hello','world','!');
$jsonString = json_encode($array);
echo $jsonString;

then what you want to do on the application server is include the remote file like this:

ob_start();
include_once('http://remoteserverdomain.com/test.php');
$string = ob_get_contents();
ob_end_clean();
$newArray = json_decode($string);

and there you have it. $newArray has the data you are looking for. now this works on any depth array, the only issue (that i have found anyway) is if your server is configured to not allow remote includes; an easy fix in php.ini though. I have found this way to be a lot easier to work with and generally more secure than using JSONP to pass the data.

Skype Down? yes it is… (not good!!)

Ok so like many small businesses, contractors, and work-from-home people, I rely on Skype as my primary VOIP service provider; not only for my home based business, but for my personal home phone lines (One U.S. one French) too.. basically I am not able to log in, which means I can’t make or receive calls. I am getting a number of voicemails which I can’t check and am resorting to calling people on my cell phone!! This is not good at all… Granted Skype has never had any outages of this scale before (that I know of anyway, this is my first one), this outage was not only for a couple seconds, or minutes… this outage has affected my virtual office of 4 employees for most of today!

Skype needs to not only fix this problem asap, but also make sure nothing like this happens again… I can already see a number of businesses getting so pissed to the point of finding a more reliable solution… I have started doing my research already..

Facebook Like button hack for IPB Board

Ok so I was trying to figure out how to add a Facebook like button to an IPB Board system, and it was not as easy as it should have been!

turns out, you need valid license to download their Facebook like module, and for what ever reason I couldn’t make the edits directly to the theme files to include the JavaScript and required div.

So this is what i did.

first I created a bbcode tag so that i could do this:

[fb]http://URL-to-like[/fb]

and it print out the right code of:

<fb:like href="http://URL-to-like"></fb:like>

that was easy. just add a bbcode tag in the bbcode administration page.
Name the tag Facebook Like Button
Create a tag [fb]
define the replacement as:

<fb:like href="{content}"></fb:like>

note: that %7Bcontent%7D above is actually {content}
for what ever reason my code parser is changing it.

Leave all the other attributes defaulted.

Then came the annoying part… how to add the required JavaScript and element to the post pages.

Solution? yes! find the JavaScript file: /public/js/ips.topic.js
and then at the very bottom of the file add the following code:

function loadFacebookMod() {
	var div = document.createElement('div');
	div.id = 'fb-root';
	if (document.body.firstChild){
		document.body.insertBefore(div, document.body.firstChild);
	} else {
		document.body.appendChild(div);
	}
	window.fbAsyncInit = function() {
	  FB.init({appId: 'your facebook app id', status: true, cookie: true,
	           xfbml: true});
	};
	(function() {
	  var e = document.createElement('script'); e.async = true;
	  e.src = document.location.protocol +
	    '//connect.facebook.net/en_US/all.js';
	  document.getElementById('fb-root').appendChild(e);
	}());
}
window.onload = loadFacebookMod;

what’s happening here is that first, you are creating a function that creates the

<div id="fb-root:"></div>

needed by the Facebook js to work, appends it to right after the opening body tag, and then we load the Facebook JavaScript. After we create that function, we tell it to load the function when the page is done loading (to make sure that it finds the body tag no problem).

Now am sure there is a better way to do this… but I couldn’t find it, so, this is my solution.

Alternative way of writing an if-else statement in php.

In PHP, there are a couple ways of writing an if-else statement. One is:

if($variable == 'something'){
	$result =  'the variable equals something';
}else{
	$result =  'the variable does not equal something';
}
echo $result

Another way of writing the above if-else statement is:

if ($variable == 'something') :
	$result =  'the variable equals something';
else:
	$result =  'the variable does not equal something';
endif;
echo $result

I used the first of the above syntax for a long time (the second I never really cared for).. but couple months ago, I started paying more attention to a completely different if-else statement syntax, used particularly for assigning values to a single variable based on the met conditions in the if-else statement. Here’s the example:

	$result = $variable == 'something' ? 'the variable equals something' : 'the variable does not equal something';
	echo $result;

What I like about this alternative way of writing an if-else statement is not only less code, but cleaner code as well.

You can also nest the if-else statements like this:

    $result = $test1 ? $test2 ? 'test1 true and test2 true' : 'test1 true and test2 false' : 'test1 false';
    echo $result;

Website – Twitter – LinkedIn – Facebook

I finally got my links up that allows me to post a single post here on the website which then posts a linkback on twitter, linkedIn, and Facebook, mostly thanks to the great Twitter API.

Editors of choice for php, xhtml, css, jquery, and mysql (a couple changes)

A little less than 3 months ago I outlined my editors of choice for my work and low and behold it didn’t take me 6 months to review that list! it actually only took me one heh. Back in May, I started looking at a few tools out there after hearing some great reviews from some fellow devs. I ended up substituting Coda and NetBeans with Transmit and TextMate.

TextMate

Everyone has always raved about TextMate but at first glance it didn’t look all that great… but then I discovered it’s real power. The way it handles Language Support Plug-ins. Bundles, as they called in TextMate, are extremely powerful! I am able to switch between auto-complete and syntax highlighting for languages on the fly with keyboard short cuts (I still haven’t figured out however, how to add a keyboard shortcut to access php bundle though..). but really the best part of it all is the ability to use and create keyboard shortcuts for virtually anything very easily and quickly.

Here’s an example of html keyboard short cuts and tag usage that I found on YouTube:

Now.. imagine this kind of power with not only HTML but also any language that you can find a bundle for. mind you, all these tags and shortcuts are fully editable and customizable, so if you need a new tag.. you can fairly easily add it.

Transmit

For a long time I felt that an FTP client on it’s own was not very useful to me (especially when I already had Coda which was an editor and ftp client in one), but Transmit has become my FTP application of choice because it is simply by far one of the best ftp/remote file management and file synchronization tools I have found. It gives me all the power of opening remote files with any of my editors and then saving them back to the server automatically that Coda gives me, as well as give me an effective method of synchronizing my local and remote files or transferring files from one server (development) to another (integration or production) as simply as drag and drop. Transmit also has (of course) permission control options for remote files and directories, which is something every FTP program either has, or should have.

Editors of choice for php, xhtml, css, jquery, and mysql

A little less than 3 months ago I outlined my editors of choice(see ‘original post’ section below) for my work and low and behold it didn’t take me 6 months to review that list! it actually only took me one heh. Back in May, I started looking at a few tools out there after hearing some great reviews from some fellow devs. I ended up substituting Coda and NetBeans with Transmit and TextMate.

TextMate

Everyone has always raved about TextMate but at first glance it didn’t look all that great… but then I discovered it’s real power. The way it handles Language Support Plug-ins. Bundles, as they called in TextMate, are extremely powerful! I am able to switch between auto-complete and syntax highlighting for languages on the fly with keyboard short cuts (I still haven’t figured out however, how to add a keyboard shortcut to access php bundle though..). but really the best part of it all is the ability to use and create keyboard shortcuts for virtually anything very easily and quickly.

Here’s an example of html keyboard short cuts and tag usage that I found on YouTube:

Now.. imagine this kind of power with not only HTML but also any language that you can find a bundle for. mind you, all these tags and shortcuts are fully editable and customizable, so if you need a new tag.. you can fairly easily add it.

Transmit

For a long time I felt that an FTP client on it’s own was not very useful to me (especially when I already had Coda which was an editor and ftp client in one), but Transmit has become my FTP application of choice because it is simply by far one of the best ftp/remote file management and file synchronization tools I have found. It gives me all the power of opening remote files with any of my editors and then saving them back to the server automatically that Coda gives me, as well as give me an effective method of synchronizing my local and remote files or transferring files from one server (development) to another (integration or production) as simply as drag and drop. Transmit also has (of course) permission control options for remote files and directories, which is something every FTP program either has, or should have.

Original post

Finding the best tools for development can be tricky.  There is so much out there, and gets more difficult when you need an IDE that can work with all the languages you use..  Ideally you would like to have 1 tool that does it all! (wouldn’t that be great?)  Unfortunately that’s not the reality we live in. :(

I have gone through many editors, and IDEs trying to find the right ones to use for my needs.  It took me some time but I think I found a solid combination.  I say I think because if history repeats, I will probably find a new tool to replace an older one 6 months – a year from now if that long.

For Initial site and XHTML I use Coda, for PHP-jQuery I use NetBeans, for CSS I use CSSEdit, and for mysql I use Navicat.

Now here’s why.

Coda

Anyone who has used Coda will tell you how awesome it is.  Though it is Mac Only (Sorry Windows users!).  The only reason I even use NetBeans on top of Coda is because Coda lacks the IDE features I like when coding in PHP and JavaScript.. as far as having a tool that allows me to not only build the initial structure (file and XHTML) but also use it as an ftp program that allows me to open any of the editing programs for any of the files  (CSSEdit for CSS, NetBeans for JavaScript and PHP files, Photoshop for image files, etc).

It does so much more though.  It has a built in terminal allowing you to ssh into any site you have set up, it has a built in reference guide area were you can add and use reference guides from anywhere online directly in the editor, it has a preview tool that allows you to preview your sites, and probably one of the most useful tools for setting up wordpress themes especially, but really can be used for any commonly used site frame is the Clips feature.

Coda Clips allow you to save code clips to use later.  What i do is have code clips for my wordpress page layouts that already include all the most commonly used tags.  I do the same for my common website frames (one column, two column, sticky to the bottom footer, fixed width, dynamic width, etc).

So as you can imagine, initial setup of a site before adding it’s logic is very effective and quick in Coda.  once I am done with the file structure, XHTML structure, and CSS, I switch over to NetBeans for the functional programing.  Though for most of my simple wordpress themes (that don’t have extensive custom functions) all I need is Coda for the entire build.

NetBeans

For a long time I used Komodo Edit,  great tool, not very stable.  crashed on me A LOT and on many occasions it would be unusably slow.. not to mention the ftp functionality for it is not very solid either..  I then went to Coda.  I will always have love for Coda, it’s an absolutely awesome tool, unfortunately it doesn’t have the PHP IDE features that I need for the large majority of my development work (I do hope they change that).. by the way, I tried Eclipse, hated it.  So then finally I found NetBeans.  NetBeans does everything I need from an IDE plus some.

Syntax highlighting, all the editors i have ever used have Syntax highlighting.. it’s one of those things where an editor simply isn’t one without it (in my opinion anyway).

Code completion not just for the languages being used but also any libraries you are using with a project!! it will automatically read the library (in my case jQuery) and give you auto complete.  Now this is a feature that has been lacking in other editors and IDEs.

Code navigation, most IDEs have Code Navigation so this is nothing new really.  except where Coda only had limited code navigation for the current file being edited/viewed, NetBeans allows you to navigate code for your entire project.  handy when placing functionality in different files.

Syntax errors and warning highlighting is also something most IDEs have.  the nice thing about NetBeans though is that it does this for both html, and php.  Instead of just php.  not a big deal since I don’t really need it for html anymore, but noteworthy.

There are many other features packed in NetBeans but I decided to only cover the ones I use the most.

CSSEdit

CSSEdit is one of those CSS editors that if you don’t use.. you should.  OS X only though (sorry Windows users..).  CSSEdit gives you complete control over your stylesheets, as well as allows you to organize your styles in groups.  these groups appear as folders in your tag navigator, very cool because you can basically have categories (global tags, header tags, footer tags, etc) and sub categories as well all nicely organized.  very good for finding style sections that you need to work with!  now CSSEdit is not just an editor.. it also allows you to essentially dissect the css of any website by using it’s preview mode.  Every wonder how something was done in css?  not a problem.  I have never been able to work with css faster.

Navicat

To be honest I haven’t tried any other database management tool other than phpmyadmin, which is well.. not that great. and you can’t really compare the two.  One of the tools I use often is the Data Transfer feature.  it allows you to transfer data from one database to another, great for transferring structures and data from test databases to production.  There is also a data import/export feature that allows you to work with a variety of different file types (csv, text, xml, excel, and DBase) which comes in handy.

A new theme for this site!

Finally got around to building the new theme from a design Phil made.

I personally love working with WordPress.  Building Themes are very easy once you learn the the basics and template tags.  As far as the basics, A good place to get started is Nettus+ Top 50 WordPress Tutorials and once you get a handle for some of the basic theme structures, you can take a look at the WordPress Codex Template Tag Reference.  It may seem a bit intimidating at first.. but it’s really not that bad.

Let me (and Phil) know your thoughts!

Use jQuery to make dynamic height containers have the same height

When working with a multi column layout where all three containers with dynamic content, you run into a problem with a css limitation (not able to do heigh: 100%;) so this problem has to be solved by using javascript.

Well, here’s the solution!

First write a function to include into the file (I usually use an external js function file so I can apply any of them anywhere needed.)

function equalHeight(group) {
    tallest = 0;
    group.each(function() {
        thisHeight = $(this).height();
        if(thisHeight > tallest) {
            tallest = thisHeight;
        }
    });
    group.height(tallest);
}

Then to use it simply use the following code in your document.

$(document).ready(function(){
    equalHeight($('.your_container'));
});

What this will do is find all elements with the class ‘.your_container’ and make them the same height on the document.
Source: CSS Newbie

Use jQuery to check if a checkbox is checked

while working on a project (how else do these things come to mind right? :P) I was looking for a way to check if a checkbox is checked or not.  The issue that I had was that the checkbox was ajax loaded (along with other content) so I needed to check on focus (Edit: I have since started using .change() instead of .focus() since an element can loose focus without changing states).  Here’s what I came up with (placing this inside the ajax loaded content, now yes there is other ways of doing this such as using .live() but this method is for the sake of this example):

	
$('.check_box_class_name').change(function(){
		if($(this).is(':checked')){
			//do something.
		}else{
			//do something else.
		}
	});

by doing this, it allows me to check when ever this element is focused changes it’s state if it’s checked or not. Now, it may not make sense to some thinking that focused elements are checked? false. an example would be clicking the check box while it’s checked (to uncheck it), by doing this you are still focusing the element (though unchecking it). So this is why I do an actual check every time I focus the element. In the past I used .focus() but then later discovered that it is more reliable to use .change() because focus does not care what the actual state of the element is in. .change() is only triggered when there is a change to the element, which is what we are looking for when working with checkboxes.

if you want to check if it’s checked on page load, simply do this:

	
if($('.check_box_class_name').is(':checked')){
		//do something.
	}else{
		//do something else.
	}

You get the idea.

Edit: ok so I was asked for a real example so here it is.

The HTML:

<form>
	<input type="checkbox" name="some_name" value="1" class="some_class">
	<input type="checkbox" name="some_name" value="2" class="some_class">
	<input type="checkbox" name="some_name" value="3" class="some_class">
	<input type="submit" value="Submit">
	<div class="result"></div>
</form>

The JS

$(document).ready(function() {
	$('.check_box_class_name').change(function(){
		var theValue = $(this).val();
		if($(this).is(':checked')){
			$('.result').html('You have checked the checkbox with the value of: '+theValue);
		}else{
			$('.result').html('You have unchecked the checkbox with the value of: '+theValue);
		}
	});
});

ProcessData js function + php logic file structure

Bellow is a javascript function I wrote to help process ajax actions because I was finding my self repeating a lot of the event trigger functions.

function processData(logicFile, container, action, id, form, onComplete){
	var Options = new Array;
	if(action != null) {
		actionArray = action.split('~');
		if(actionArray[0] != null){
			Options.push('action=' + escape(actionArray[0]));
		}
		if(actionArray[1] != null) {
			Options.push('sub_action=' + escape(actionArray[1]));
		}
	}
	if(id != null) {
		Options.push('id=' + escape(id));
	}
	if(form != null) {
		var keyValueArray = form.split('&');
		var i = 0
		while (i < keyValueArray.length) {
			Options.push(keyValueArray[i]);
			i++;
		}
	}
	if(onComplete == null) {
		onComplete = function(data){
			$(container).html(data.responseText);
		}
	}
	$.ajax({
		type: 'POST',
		url: logicFile,
		data: Options.join('&'),
		complete: onComplete
	});
}

Now here’s how it works.

Lets start with the variables that are passed into this function.

logicFile: (string)(required)(example: ‘/users/userslogic.php’) this is the php (can be any server side language that can interface with ajax) logic file path (I would use relative to the document root).  So an example would be say your administrative panel logic file is separate from other areas of your website, say you have different logic files for different areas of your site.  For small websites it’s not necessary to break sections up into logic files but when dealing with large and complex web apps, I like to break things up a bit for organizational and security purposes.

container: (string)(required if onComplete is null, otherwise you control the output container via the onComplete function – keep reading for details)(example: ‘.user_action_result’) this is the css element for the element container that will be populated with the processed and returned result/data from the logic file.  Though it is required that this variable is assigned, it is not required for it to be a real element.

action: (string)(required) (example: ‘manage_users~add’) this is the action trigger which can take both a parent and sub action that are defined in the logic file (which will be further explained later). You will notice in the example there are two pieces delimited by a ~.  The ~ indicates that there is a sub action to this action.  in this example’s case we are triggering the action ‘manage_users’ and the of that action the sub action of ‘add’.  so you can basically access different parts of the manage_users parent action by assigning a sub action.  Note: it is not required that the action have a sub action.  the sub action (‘~add’ in this case) is optional.

id: (string)(optional)(example: ’7′) This is an optional variable used in situations where you are trying to manipulate a specific record that is uniquely identified.

form: (string)(optional)(example: ‘username=jubairsaidi&email=bogus@bogus.com’)  when working with forms of any size, this comes in very handy.  don’t be fooled by the example, that is simple how it should look like being sent, however the way I work with this variable is by applying the .serialize() jQuery function on forms so I end up simply assigning a form to a variable (example: var serializedForm = $(‘.user_form’).serialize();) so all I have to do is in the form variable position within the proccessData function I just have the serializedForm variable sent.

onComplete: (function)(optional) (example: function(){ … } ) If you wish to do more than the default action for this function which is return the result to the specified element/container, such as take the returned data and run it through additional logic, then this is where you assign that function.  it is possible to nest the processData function as many times as necessary for any given event trigger.

Now that the jQuery javascript function is covered, lets take a look at a php logic file example that the above function would interface with (note for simplicity’s sake, I chose to exclude the file security).

switch($_POST['action']) {
	case 'manage_users':
		switch($_POST['sub_action']){
			case 'show_all':
				echo('php logic pulling list of users from database and then echoes it here');
				break;
			case 'show_user':
				echo('php logic pulling user information from database and then echoes it here');
				break;
			case 'add':
				//add the logic here and then
				if($user_added){
					echo('User Added');
				}else{
					echo('User was not added.  please try again.');
				}
				break;
			case 'edit':
				//add the logic here and then
				if($user_edited){
					echo('User Edited');
				}else{
					echo('User was not edited.  please try again.');
				}
				break;
			case 'delete':
				//add the logic here and then
				if($user_deleted){
					echo('User Deleted');
				}else{
					echo('User was not deleted.  please try again.');
				}
				break;
		}
		break;
	case 'manage_comments':
		...
		break;
}

You get the idea.

now for event trigger usage. say you have a manage_users.php file that holds the interface that you use to manage your users. at the top of this file (or bottom, or included as a js file, however you choose) you should have the following.

$(document).ready(function(){
	$('a.add_user').live('click',function(){
		var addUserForm = $('form#add_user_form').serialize();
		processData('/users/userslogic.php', '.add_user_result', 'manage_users~add', null, addUserForm, null);
	});
});

So basically when ever any link with the class ‘.add_user’ is clicked, this above block is processed.  now note that I used the .live event handler in this case.  I did this because often I have action links/buttons within ajax loaded content and .click() only works on content that was loaded into the dom on page load (which ajax is post page load).

I hope this was helpful! if more you need more detail/examples/explanation, please feel free to contact me with any questions you may have.