jquery .submit() not passing value to action page - php

Question

i am trying to load the content of the php page in the div "content", using .submit in jquery. i am facing a problem that when i press the submit btn the values dont get passed to the action page. here is the form code
<form id="f1" action="attandace/students/take_attandance.php" method="post" enctype="multipart/form-data" >
<table>
<tr>
<td><label id="sb">Subject Name</label></td>
<td>
<select id="s_b" name="subject_name">
<option value="0">Select</option>
<?php echo $option; ?>
</select>
</td>
<td><label id="cn">Class Name</label></td>
<td>
<select id="c_n" name="class_name">
<option value="0">Select</option>
<?php echo $option2; ?>
</select>
</td>
</tr>
<tr>
<td colspan="4"><div align="center"><input id="btn" type="submit" name="tk" value="Take Attandance" />
</div></td>
</tr>
</table>
</form>
jquery script:
$(document).ready(function(e)
{
$('form').submit(function(e)
{
e.preventDefault();
$('#content').load($(this).attr('action'));
});
});

Answer 1

You need to pass the values along using the data argument.
You can make use of .serializeArray() for it.
$(document).ready(function (e) {
$('form').submit(function (e) {
var $form = $(this);
e.preventDefault();
$('#content').load($form.attr('action'), $form.serializeArray());
});
});