Ajax post method not working

[eluser]Unknown[/eluser]
Ajax post not working in my code i don't know what exact problem the original code (controller code) please help me

Code:

class Ajax_post extends CI_Controller {

function __construct()
{
parent::__construct();  
$this->load->helper(array('url'));
}

function index()
{

$this->load->view('ajax_post');
}

function post_action()
{

if(($_POST['username'] == "") || ($_POST['password'] == ""))
{
  $message = "Please fill up blank fields";
  $bg_color = "#FFEBE8";

}elseif(($_POST['username'] != "myusername") || ($_POST['password'] != "mypassword")){
  $message = "Username and password do not match.";
  $bg_color = "#FFEBE8";

}else{
  $message = "Username and password matched.";
  $bg_color = "#FFA";
}

$output = '{ "message": "'.$message.'", "bg_color": "'.$bg_color.'" }';

}
}

?>

This is my view page code

Code:

<div id="form_message"></div>
    &lt;form name="ajax_form" id ="ajax_form" method="post"&gt;

      Username/Email:*&lt;input type="text" name="username" id="username" size="30" /&gt;&lt;br/><br/>
      Password:*&lt;input type="password" name="password" id="password" size="30" /&gt;&lt;br/><br/>
      &lt;input type="submit" value="Submit" name="login_submit" id="login_submit"&gt;

  &lt;/form&gt;
</div>

This is my javascript code (ajax_post.js)

Code:

function getData(){

    var username=$("#username").val();
    var password=$("#password").val();      
    $.ajax({
    type: "POST",
    url: "http://localhost/CodeIgniter/index.php/ajax_post/post_action",
    dataType: "json",
    data: "username="+username+"&password;="+password,
    cache:false,
    success:
      function(data){
          alert(data);
          }
     // $("#form_message").html(data.message).css({'background-color' : data.bg_color}).fadeIn('slow');


});
}