jquery and javascript

jquery and javascript

They don't seem to be playing nice together, or I'm doing something wrong..?? This function keeps returning "undefined" when I can see the json data correctly. At first I thought it's a global var issue with javascript, but I think I'm declaring "rPiece" properly. Do I have to send "rPiece" to and from the XHR request? I also tried setting "rPiece" outside the function with no luck. Please help. Thank you.

Here's the function:

  1. function fnFormatDetails(){
  2.     var rPiece;
  3.    
  4.     $.post("../i/php/autos-exe.php",
  5.         {pieceid:"12345"},
  6.             function(data){
  7.                 if(data.pieces.length>0){
  8.                     rPiece = '<table>';
  9.                     for (var i=0;i<data.pieces.length;i++){
  10.                         rPiece += '<tr><td>'+data.pieces[i].id+'</td></tr>';
  11.                     }
  12.                     rPiece += '</table>';          
  13.                 }
  14.             }
  15.     ,"json");
  16.    
  17.     return rPiece;
  18. }

Here's the returned JSON data:


{"pieces":[{"id":"8653"}]}