Please see attached image for details.
Brief description
- User click “View”
- User select “Year”
- Show all records of that “Year”
For Step 2, when user click “Select Year”, the whole page refresh, which goes back to Step 1.
My intention was to use ajax to display the records, but I’m not sure where the error was.
There are 2 php files:
A) order_view.php
This php shows up to step 2.
B) order_view_ByYear.php
At step 3 after user clicks “Select Year”, use ajax to display the records at the bottom.
A) order_view.php
<script type="text/javascript">
function submitYear(sno)
{
var cusid=sno;
var yearSelDD=document.getElementById("selectYear");
var yearSel = yearSelDD.options[yearSelDD.selectedIndex].value;
alert("cusid = " + cusid + " yearSel = " + yearSel);
$.ajax({
type:'POST',
url:'order_view_ByYear.php',
data:{
cusid:cusid,
yearSel:yearSel,
wrapper:"testing"
},
//If successful, which part of webpage to change?
success: function(result)
{
$('#showOrders').html(result);
}
});
}
</script>
...
some codes
...
//============================== Display that User's Orders using ajax ==============================
$sql2 = $mysqli->query("select * from orders where customerid='$cusid' ORDER BY orderid DESC");
if ($sql2->num_rows > 0) {
while ($row2 = $sql2->fetch_assoc()) {
// Populate the YearArray() DropDownList
$rowYear = date('Y', strtotime($row2["date"]));
if($YearToAdd != $rowYear)
{
$YearToAdd = $rowYear;
array_push($YearArray, $YearToAdd);
}
}
}
?>
<table><tr><td>
<form method="post">
<select>
<?php
// Iterating through the YearArray()
foreach($YearArray as $item){
echo "<option value='$item'>$item</option>";
}
?>
</select>
<input type="submit" value="Select Year" id="selectYear" class="send" onClick="javascript:submitYear($ssno)"/>
</form>
</td></tr></table>
<br/>
<?php
echo "<div id="showOrders"></div>";
...
some codes
...
B) order_view_ByYear.php
<?php
error_reporting(0);
include "../database_connection.php";
$cusid = $_POST['cusid'];
$YrSelect = $_POST['yearSel'];
echo "CustID = ". $cusid . " Year = " . $YrSelect;
?>
I added an ALERT, but no Alert happened after clicking button “Select Year”.
My expected result is it should echo the 2 variables CustID & Year at the bottom.
Instead, the Whole page refresh itself and goes back to Step 1.
Much Appreciated.