Jquery .load() mit Daten aus Formular
Ich versuche eine Seite zu laden in einem modalen Fenster "checkout.php" nachdem Sie ein Formular ausgefüllt, aber ich muss es zum laden mit den Ergebnissen des Formulars. Normalerweise würde man einfach die Aktion des Formulars an die url und die Daten übergeben bekommt, aber in diesem Fall, wird die Seite geladen werden muss, in ein modales mit, dass Daten, die erfordert die Verwendung von jQuery, als ich weiß.
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>
Was ich über die Last der checkout.php Seite in der modal-nach dem Klick auf den submit button für das Formular. Ich BIN NICHT Fragen, warum die Seite nicht laden, mit der Informationen gesendet, mit der form. Ich völlig verstehen, dass das, was ich hier mache ist einfach der Ausführung einer Funktion zu laden "checkout.php" in den div, der das modal. Ich brauche jemanden, mir zu erklären, wie kann ich mein edit-Funktion, so dass "checkout.php" geladen wird, wie wenn es die Aktion des Formulars, werden die Daten weitergeleitet werden.
Vielen Dank im Voraus für die Hilfe!
BEARBEITEN UNTEN
<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;
});
DEN CHECKOUT.PHP SEITE, WO ES FORDERT DIE EINGABE "Versand"
<?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>
- Mögliche Duplikate von: stackoverflow.com/questions/1218245/... Die Frage ist nicht ganz der gleiche, aber die Antworten sind gleichwertig, deshalb habe ich markiert diese als Duplikat.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Binden, um das submit-Ereignis im Formular, statt mit dem onClick-Attribut.
Auf "Absenden", serialise das Formular Werte, die post an Ihre url und fügen Sie das Ergebnis in das Ziel-div.
EDIT 1: Ihrem html, müssen Sie ersetzen
mit
.load('url', {})
). Ich würde vorschlagen, jedoch mit .post (), denn Sie bietet die Möglichkeit, Fehler zu behandeln explizit..html(result)
fügt einfach nur den Rückgabewert von deiner url in das Ziel-div. Sind Sie immer javascript-Fehler? Können Sie bestätigen, dass Ihre Anfrage wird vom server bearbeitet, richtig?.success()
und.error()
werden nicht mehr unterstützt. Sie wurden ersetzt durch.done()
und.fail()
Verwenden
$.post()
zu senden Sie das Formular mit ajax.