| searls03 |
11-19-2012 03:48 AM |
Form from Ajax loaded page
so I have a page that loads content via AJAX.
Code:
$('#responseForm<?php echo $id; ?>').submit(function(){$('input[type=submit]', this);});
function parseResponse<?php echo $id; ?> ()
{
var hiddenField2<?php echo $id; ?> = $("#hiddenField2<?php echo $id; ?>");
var hiddenField<?php echo $id; ?> = $("#hiddenField<?php echo $id; ?>");
var hiddenField1<?php echo $id; ?> = $("#hiddenField1<?php echo $id; ?>");
var url = "news_parse1.php";
$.post(url,{ hiddenField2: hiddenField2<?php echo $id; ?>.val(),hiddenField: hiddenField<?php echo $id; ?>.val(), hiddenField1:hiddenField1<?php echo $id; ?>.val() } ,
function(data) {
});
setTimeout(function() {
$.ajax({
type:"POST",
url:"news_load1.php",
data:"getNews=true",
success: function(r){
$("#newsContent").html(r);
},
error: function(){
alert($(".hiddenField2<?php echo $id; ?>").val());
$("#error").text($(".hiddenField2<?php echo $id; ?>")).fadeIn(300)
}
})
},200);
}
then this page is the loaded page in the div:
Code:
<?php
session_start();
include_once("connect.php");
if(isset($_POST['getNews'])){
$cid = 'abcdefghijklmnop';
$academy = 'Old_Cheney';
if($academy=="Old_Cheney"){$city= "Lincoln";}else if($academy=="Yankee_Hill"){$city= "Lincoln";}else if($academy=="Holdrege"){$city= "Lincoln";}else if($academy=="Maple"){$city= "Omaha";}
else if($academy=="Center"){$city= "Omaha";}
else if($academy=="Pensacola"){$city= "Pensacola";}
$sql = mysql_query("SELECT * FROM login where academy ='$academy'");
?>
<?php
if(($_POST['submit'])){
$price=$_POST["price"];
$quant=$_POST["qty"];
$id=$_POST["id"];
$discount=$_POST["discount"];
$point=".";
$disc= $point.$discount;
if(isset($_POST['discount'])){$price1=$price * $disc;
$price2= $price - $price1;
mysql_query("UPDATE cart SET price = '$price2', quantity = '$quant' WHERE id = '$id' ");
}else{
mysql_query("UPDATE cart SET price = '$price', quantity = '$quant' WHERE id = '$id' ");
}
?>
<script>
$("#newsContent").load("index.php #newsContent");
</script>
<?php
}
?>
<script src="scripts/jquery-1.6.1.min.js" type="text/javascript"></script>
<script src="scripts/jquery.dataTables.min.js" type="text/javascript"></script>
<script src="scripts/jquery.dataTables.columnFilter.js" type="text/javascript"></script>
<script src="scripts/jquery.dataTables.pagination.js" type="text/javascript"></script>
<link href="css/data_table.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/* BeginOAWidget_Instance_2586523: #dataTable */
@import url("css/custom/base/jquery.ui.all.css");
#dataTable {padding: 0;margin:0;width:100%; }
#dataTable_wrapper{width:80%;
}
#dataTable_wrapper th {cursor:pointer}
#dataTable_wrapper tr.odd {color:#000; background-color:#FFF}
#dataTable_wrapper tr.odd:hover {color:#333; background-color:#CCC}
#dataTable_wrapper tr.odd td.sorting_1 {color:#000; background-color:#999}
#dataTable_wrapper tr.odd:hover td.sorting_1 {color:#000; background-color:#666}
#dataTable_wrapper tr.even {color:#FFF; background-color:#666}
#dataTable_wrapper tr.even:hover, tr.even td.highlighted{color:#EEE; background-color:#333}
#dataTable_wrapper tr.even td.sorting_1 {color:#CCC; background-color:#333}
#dataTable_wrapper tr.even:hover td.sorting_1 {color:#FFF; background-color:#000}
/* EndOAWidget_Instance_2586523 */
</style>
<script type="text/xml">
<!--
<oa:widgets>
<oa:widget wid="2586523" binding="#dataTable" />
</oa:widgets>
-->
</script>
<script type="text/javascript">
// BeginOAWidget_Instance_2586523: #dataTable
$(document).ready(function() {
oTable = $('#dataTable').dataTable({
"bJQueryUI": true,
"bRetrieve": true,
"bScrollCollapse": false,
"sScrollY": "125px",
"bAutoWidth": true,
"bPaginate": true,
"sPaginationType": "two_button", //full_numbers,two_button
"bStateSave": true,
"bInfo": false,
"bFilter": false,
"iDisplayLength": 100,
"bLengthChange": false,
"aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]]
});
} );
// EndOAWidget_Instance_2586523
</script>
<table cellpadding="0" cellspacing="0" border="0" id="dataTable">
<thead>
<tr>
<th>ID</th>
<th>Product</th>
<th>Category</th>
<th>Price</th>
<th>Quantity</th>
<th>Discount</th>
</tr>
</thead>
<tbody>
<!--Loop start, you could use a repeat region here-->
<?php
$sql1= mysql_query("SELECT * FROM cart where cart_id='$cid' ORDER BY id ASC ");
while($row1 = mysql_fetch_array($sql1)){
$price = $row1['price'];
$product = $row1['product123'];
$id = $row1['id'];
$qty = $row1['quantity'];
$category = $row1['category'];
$total = $price + $total;
if ($total == " "){$total = "0";}
?>
<form action="news_load1.php" method="post" id="form"><tr height="10">
<td><input name="id" type="text" value="<?php echo $id; ?>" size="5" /></td>
<td><?php echo $product; ?></td>
<td><?php echo $category; ?></td>
<td><input name="price" type="text" value="<?php echo $price; ?>" size="5" /></td>
<td><input name="qty" type="text" value="<?php echo $qty; ?>" size="5" /></td>
<td><input name="discount" type="text" value="" size="5" /> <input name="submit" type="submit" /></td>
</tr></form>
<?php
}}
?>
</tbody>
</table>
<?php echo $total; ?>
How do I make it so that the form in the loaded page will submit via ajax or php(like I am trying to now, but it doesn't submit). The main page that has the loaded div can't refresh though, but the div could. any help on this? |
