data not being displayed correctly - php

Question

When I submit a form using the attached code, instead of the message appearing in the div, the screen is refreshing itself and it is holding the completed form in the browser cache. I have obviously got it wrong somewhere and would be grateful if someone could point out my error. I have posted the relevant code, but if there is something I have missed, then please let me know.
In firebug, I can see the correct data that is being returned in the post tab.
I wasn't sure of the best place to post, so if this is incorrect, admin, please amend as you see fit. many thanks.
jquery code
//Begin function to submit report form
$(function(){
$(".frmreport").submit(function(){
var formdata = $(this).serialize();
$ajax({
type: "POST",
url: "../frm10010.php",
data: formdata,
dataType: "json",
success: function(msg){
$("#report_result").html("You have succesfully submitted your report. Thank you.");
}
});
return false;
});
});
// End function to submit report form
frm10010.php
<?php
$dept = mysql_real_escape_string($_POST['dept']);
$name = mysql_real_escape_string($_POST['name']);
$email = mysql_real_escape_string($_POST['email']);
$position = mysql_real_escape_string($_POST['position']);
$feedback = mysql_real_escape_string($_POST['feedback']);
$form = array('dept'=>$dept, 'name'=>$name, 'email'=>$email, 'position'=>$position, 'feedback'=>$feedback);
$result = json_encode($form);
echo $result;
?>
html
<div id="report_result"></div>
<div id="formShow">
<form class=frmreport" method="post" class="webform">
<fieldset>
<legend><span class="subtitle">Submit Technical Report</span></legend>
<label for="dept">Department</label>
<input id="dept" name="dept" class="text" type="text" />
<label for="name">Full Name:</label>
<input id="name" name="name" class="text" type="text" />
<label for="email">Email address:</label>
<input id="email" name="email" class="text" type="text" />
<label for="position">Position:</label>
<input id="position" name="Position" class="text" type="text" />
<label for="feedback">Problem:</label>
<textarea name="feedback" cols="22" rows="5"></textarea>
</fieldset>
<input class="submit" type="submit" name="submit" value="Submit Report" />
<input class="cancel" type="reset" name="cancel" value="Clear Report" />
</form>
</div>

Answer 1

You have couple of errors here
$ajax({ should be $.ajax({
Second you have an error in the form class
<form class=frmreport" method="post" class="webform">
should be
<form class="frmreport" method="post" class="webform">

Answer 2

Don't use
$(".frmreport").submit(function(){
Instead use
$("#sub_btn").click(function(){
And in html
<input class="submit" type="submit" name="submit" value="Submit Report" />
Change it to
<input class="submit" id="sub_btn" type="button" name="submit" value="Submit Report" />
Another way to do it making submit handler false. But above solution will work here. There is also . is missing in ajax call.