Undefined index: img error while processing the form with Ajax

Question

I can't process the uploaded image file with php ajax requuest. It's process the text field but can't process uploaded file. Following is my form. can you tell me what is wrong in my simple code and how can i solve it ?

and without upload file i saw that it's not redirect after successfull.

html form

<link rel="stylesheet" href="http://jquery.bassistance.de/validate/demo/css/screen.css" />
<script src="http://jquery.bassistance.de/validate/lib/jquery.js"></script>
<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
<script>    
// JQuery Script to submit Form
$(document).ready(function () {
    $("#commentForm").validate({
        submitHandler : function () {
            // your function if, validate is success
            $.ajax({
                type : "POST",
                url : "process.php",
                data : $('#commentForm').serialize(),
                success : function (data) {
                    $('#message').html(data);
                }
            });
             return false;
        }
    });
});


</script>

<form class="cmxform" id="commentForm" method="get" action="" enctype="multipart/form-data">
    <fieldset>
            <p>
                <input type="text" name="text"/>
            </p>
            <p>
                <input type="file" name="img"/>
            </p>
            <p>
                <input class="submit" type="submit" value="Submit" />
            </p>
    </fieldset>
</form>

<div id="message"></div>

php process page:

<?php
$text =  $_POST['text'];
$file = $_FILES['img']['name'];
if(empty($text) && empty($file))
{
    echo "Both field is empty ";
}
else
{
    header("Refresh:3, url=ajax_form.php");
}
?>