Trouble with creating Table in Javascript/Jquery

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
pizzipie
Forum Commoner
Posts: 87
Joined: Wed Feb 10, 2010 10:59 pm
Location: Hayden. ID

Trouble with creating Table in Javascript/Jquery

Post by pizzipie »

I am trying to create a table from data returned in JSON format from PHP server.

Can anyone tell me what I am doing wrong in the following code. The CODE ====> Javascript returns all the correct and calculated (price) value(s) but there is no "table" just a box showing the data without format. The CODE ====> PHP produces a true "table" properly formatted.

Thanks in advance,

RP

Code: Select all





CODE ===> Javascript


 $(document).ready(function() {	

$('#rbox').show();	

		$.getJSON('sagleAllData2.php?invoice=9', function(invDetail) {
			
			var content=""; vend=""; invo=""; dat=""; price=0;

				vend=invDetail[0]['vendor'];
				invo=invDetail[0]['invid'];	
				dat=invDetail[0]['date'];
				
					
			content  = "<table border='3' cellpadding='5' bgcolor='#feede3'>";
			$(content).appendTo("#rbox");
			
			content = "<caption><big><b>" +vend+ " - Invoice " +invo+ "Dated " +dat+ "</b></big></caption>\n"; 
            	$(content).appendTo("#rbox");
            	
            	content = "<tbody><tr><th>Item</th> <th>Price</th> <th>Project</th> <th>Work Code</th></tr>\n";
            	$(content).appendTo("#rbox");				
            				
	$.each(invDetail, function(key, val) {			
			
		content = '<tr><td>' + val.desc+ '</td>\n';
            	content += '<td'> + val.price+ '</td>\n';
            	price+=parseFloat(val.price);
            	content += '<td>' + val.project+ '</td>\n';
             	content += '<td>' + val.code+ '</td></tr>\n';
             	           	            			
            	$(content).appendTo("#rbox");
			
	});
			content="<tr><td> Invoice Total" +price+ "</td></tr>\n";
			content +="</tbody></table>";
		   	$(content).appendTo("#rbox");
			
			  	
      	}); // getJSON  
      	
});   // doc ready  

CODE ========> PHP
Table produced by PHP Code
Table produced by PHP Code

Code: Select all


<?php

$total = 0;

printf("<table border='3' cellpadding='5' bgcolor='#feede3'>\n");
printf("<caption><big><b>%s - Invoice %s Dated %s </b></big></caption>\n", 
		$requestedData[0]['vendor'], $requestedData[0]['invno'], $requestedData[0]['date']);	
printf("<tr> <th>Item</th> <th>Price</th> <th>Project</th> <th>Work Code</th> </tr> \n");

for($i=0; $i < count($requestedData); $i++) {
	$total += $requestedData[$i]['price'];
	printf("<tr><td>%s</td><td>%.2f</td><td>%s</td><td>%s</td></tr>\n", $requestedData[$i]['desc'], 
			$requestedData[$i]['price'], $requestedData[$i]['project'], $requestedData[$i]['code']);
} 
printf("<tr><td>Total Invoice:</td><td> %.2f</td><td></td><td></td></tr>\n", $total);
printf("</table>\n");

?>

Attachments
Table?? produced by Javascript
Table?? produced by Javascript
Post Reply