Update a profile field with AJAX (Edit In Place)?

Hey mate

Sorry all I've been ridiculously busy! If memory serves me correctly Luca, there's a function in the Drupal 5 API called user_save. I'm pretty sure I used that with updated field information. I'll post what I used when I return from work.

Once again, apologies to all who've been camping on this thread!

It's been a busy few months, but here's pretty much the code I've used in my 5.x install. It's not the best but that's because I haven't had time to revisit it and check it for bad stuff. Drupallers feel free to make it better as you see fit, but please post your improvements!

Ok first in my user-profile.tpl.php, I have a class called '.profField' attached to the times I want to be jEditable.

Here's an example field, using a custom defined profile text field called 'nickname':

<div class = "profField" id = "profile_nickname">
<? if($account->profile_nickname){
 print(check_markup($account->profile_nickname));
} else{ 
print("Ohh! ".$account->name." hasn't filled this in yet!");
} ?>
</div>

Also, in user-profile.tpl.php, I have this in my head code, a small peice of Javascript: ( Ideally this should be added with a module, using drupal_add_js(), but I did this a long time ago.)

<script src="<? print base_url().path_to_theme();?>js/jquery.1.2.1.pack.js" type="text/javascript"></script>
<script src="<? print base_url().path_to_theme();?>js/jquery.jeditable.pack.js" type="text/javascript"></script>
<script type="text/javascript">

$(".profField").editable("/user_saver/get_the_info",{
			indicator: "Saving...",
			onblur: 'submit'
			});	
</script>

That tells my module to pass the value of that field to the location '/user_saver/get_the_info'. That location is defined using a menu call back in my module. Take a look below:

file: user_saver.module:

function user_saver_menu($may_cache) {
  $items = array();
  if ($may_cache) {
    $items[] = array(
      'path' => 'user_saver/get_the_info',
      'access' => TRUE,
      'type' => MENU_CALLBACK,
      'callback' => 'user_saver_get_the_info'
     );
  }
  else {
// here is where you'd add the js to the module.
//say: user_saver_load_js();
  }
 
  return $items;
}

function user_saver_get_the_info() {
	global $user;
	$id = $_POST['id'];
	$output = $_POST['value'];

        //Get user's id
	$uIDx = $user->uid;

        //Retrieve users information via id.
	$userInfo = user_load(array('uid'=> $uIDx));

	//see what's changed
	if($userInfo->$id != $output){
		//something has changed
		//include changed value.
		$userInfo->$id = $output;
		
	}
	
	$userInfo = (array) $userInfo;
        //Hardcoded category because I know where my fields are, still naughty tho!
	$cat = 'Personal Information';
         
        //Save user's information using updated value
	$user = user_save($user, $userInfo, $cat);

        
	echo $output;
}

Ok, so user_saver_menu defines a path, which when visited, calls user_saver_get_the_info(). When we're in user_saver_get_the_info(), we get the value of the element's ID (that had a class of 'profField') that's being updated from our $_POST values array, and also retrieve the value that is inside that element.

Then, we load all the user's information, find the changed value, and then update our user using user_save. I've hardcoded the category there because I know what category my field belongs to, but ideally this should be determined programattically .

Perhaps the glaring issue with this is user_save is called for every single field update. At the time I couldn't see a way around it, so please feel free to improve!

I take no responsibility if something goes wrong with your site using this code, and it is rudimentary. Always back up your files, and remember you need jQuery 1.2.1 and jEditable as well. If you have questions, please ask and I'll get back to you.

Note: Currently this only handles text fields, but I intend to turn the code into a module to handle drop down lists and so on