FirePHP the Console Message Logger useful for ajax

FirePHP the Console Message Logger usefull for ajax

Step 1 : Install Firebug extension on firefox


https://addons.mozilla.org/en-US/firefox/addon/firebug/

Step 2 : Install FirePHP extension on firefox


https://addons.mozilla.org/en-US/firefox/addon/firephp/

Step 3 : Go to -> http://www.firephp.org/
Step 3.1: Download FirePHPLibrary from ” FirePHPCore Server Library ”
Step 3.2: Click on Download FirePHPCore x.x.x (zip)

OR


http://www.firephp.org/DownloadRelease/FirePHPLibrary-FirePHPCore-0.3.2

Step 4 : Extract FirePHPLibrary-FirePHPCore-x.x.x.zip
Step 5 : Copy lib file from extracted folder

Step 6 : Go to your www directory create a folder firephpDemo and paste lib inside
example : /var/www/firephpDemo/lib
Step 7 : Create two files index.php and ajax.php

index.php


<!DOCTYPE html>
<html>
<head>
	<title>FirePHP::Rajesh Ganjeer</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
       //var formData = $("#myform").serialize();  //or
       //var formData = $("#myform").serializeArray();
       //var URL = $("#myform").attr("action");
	//var  formData = "fname=Rajesh&lname=Ganjeer";	

	var  formData = $.param({fname:"Rajesh",lname:"Ganjeer"});
  $("button").click(function(){
    $.ajax({
    	url:"ajax.php",
    	type: "POST",
    	data : formData,
    	success:function(result){
      		$("#div1").html(result);
    	}
    });
  });
});
</script>
</head>
<body>
<div>
	<p><b>Press F12</b> to show the console & <b>clear</b> the console</p>
	<p>Make Sure that inside console, the tab name <b>All</b> must be selected </p>
</div>
<div id="div1"><h2>Let try FirePHP to log using jQuery AJAX</h2></div>
<button>Click here to see logs in console </button>
</body>
</html>


ajax.php


<?php
include('lib/FirePHPCore/fb.php');

//Printing messages in console

FB::log('Log message');
FB::error('Error message');
FB::info('Info message');
FB::warn('Warn message');

//Printing array in console

FB::log(['Short Array', 'Data', 'By', 'Rajesh Ganjeer']);
FB::log(array('array', 'Data', 'By', 'Rajesh Ganjeer'));

echo 'It Has been successfully done by: <h1>'.$_REQUEST['fname'].' '.$_REQUEST['lname'].'</h1>';

?>

OR

Step 7 : Download files and rename it to firephpDemo.zip

firephpDemo.zip

Step 8: Give Permission to folder and files 777
Step 9: http://localhost/firephpDemo/index.php
Step 10: Read the index.php page instruction and click button

Output:

firephp output

You are done !

Advertisements

Add Firebug lite to any browser

<a href="javascript:if(!window.firebug){window.firebug=document.createElement(&quot;script&quot;);firebug.setAttribute(&quot;src&quot;,&quot;http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js&quot;);document.body.appendChild(firebug);(function(){if(window.firebug.version){firebug.init()}else{setTimeout(arguments.callee)}})();void (firebug);if(window.debug&&debug.setCallback){(function(){if(window.firebug&&window.firebug.version){debug.setCallback(function(b){var a=Array.prototype.slice.call(arguments,1);firebug.d.console.cmd[b].apply(window,a)},true)}else{setTimeout(arguments.callee,100)}})()}};"> Example Click Here Firebug Lite : Debug + Firebug Lite</a>
< Example Click Here Firebug Lite : Debug + Firebug Lite

Go to this page and click on below of the page firbug lite
http://benalman.com/code/projects/jquery-hashchange/examples/hashchange/