JQuery .load () с данными из формы

Я пытаюсь загрузить страницу в модальное окно "checkout.php" после отправки формы, но мне нужно, чтобы она загружалась с результатами формы. Обычно можно просто установить действие формы на URL-адрес, и данные будут переданы, но в этом случае страницу необходимо загрузить в модальное окно с этими данными, что требует использования большего количества jQuery, чем я знаю.

HTML

<form id="shippingform" name="shippingform" method="post" action="#">
<table id="box-table-a" width="25%" border="1">
<thead>
    <tr>
        <th scope="col" width="40%">USPS Option</th>
        <th scope="col" width="40%">Price</th>
        <th scope="col" width="20%" style="text-align: right;">Select</th>
    </tr>
</thead>
<tbody>
<tr>
  <td class="first">Ground:</td>
  <td><?php echo "$" . sprintf("%01.2f", $groundTotal) ?></td>
  <td class="last"><input name="shipping" type="radio" id="radio" value="<?php echo $groundTotal ?>" checked="checked" /></td>
</tr>
<tr>
  <td class="first">Priority:</td>
  <td><?php echo "$" . sprintf("%01.2f", $priorityTotal) ?></td>
  <td class="last"><input type="radio" name="shipping" id="radio2" value="<?php echo $priorityTotal ?>" /></td>
</tr>
<tr>
  <td class="first">Express:</td>
  <td><?php echo "$" . sprintf("%01.2f", $expressTotal) ?></td>
  <td class="last"><input type="radio" name="shipping" id="radio3" value="<?php echo $expressTotal ?>" /></td>
</tr>
</tbody>
</table>
<a href="#" onclick="totalCalc()">submit</a>
</form>

JS

<script language="javascript">
function totalCalc() {
$('#cartdialog').load("/ash/shop/checkout.php");
}
</script>

То, что я написал выше, загрузит страницу checkout.php в модальное окно после нажатия кнопки отправки формы. Я НЕ спрашиваю, почему страница не загружается с информацией, отправленной с формой. Я полностью понимаю, что то, что я здесь делаю, - это просто выполнение функции для загрузки checkout.php в модальный блок div. Мне нужно, чтобы кто-нибудь объяснил мне, как я могу отредактировать свою функцию так, чтобы "checkout.php" загружается, как если бы это было действие формы, данные были бы переданы.

Заранее благодарим за помощь!

ИЗМЕНИТЬ НИЖЕ

<form id="shippingform" name="shippingform" method="post" action="#">

JS

$('#shippingform').submit(function(event){
var data = $(this).serialize();
$.post('/ash/shop/checkout.php', data)
    .success(function(result){
        $('#cartdialog').html(result);
    })
    .error(function(){
        console.log('Error loading page');
    })
return false;
});

СТРАНИЦА CHECKOUT.PHP, ГДЕ ОНА ВЫЗОВАЕТ INPUT «доставка»

<?php 
//total up price of all items
$subtotal = ($subtotal + ($row_rsMyCart['price'] * $row_rsMyCart['quantity']));
$myTotal = ($subtotal + $_POST['shipping']);

} while ($row_rsMyCart = mysql_fetch_assoc($rsMyCart)); ?>
</table>
<p>
<?php
//development
echo "<br>";
echo "Subtotal: $" . sprintf("%01.2f", $subtotal);
echo "<br>";
echo "Total: $" . sprintf("%01.2f", $myTotal);
?>
</p>