Edit PHP/AJAX to deal with DELETE OR EDIT -
first of before show code explain how webpage works.
- user selects date -> ajax calls on date change
- resulting php data displays in 2 sections on page.
- first section orders table contents
- second section items table contents (not including items inside orders)
what trying add functionality 3 buttons change tables dynamically using ajax. have working non ajax requests.
here code:
$(document).ready(function(){ $('.date-picker').change(function(){ $.ajax({ type: 'post', url: 'php/getproduct.php', data: {dateorderpicker: $('.date-picker').val()}, datatype: 'json', success: function(data) { $("#cartrow").html(data.result_1); $("#otheritems").html(data.result_2); } }); }); });
php file current ajax:
session_start(); include('db_config.php'); $datepicker = $_post['dateorderpicker']; $sql = "select * orders deliverydate = ? , customerid = ? "; $stmt = $conn->prepare($sql); $stmt->bindparam(1, $datepicker, pdo::param_str); $stmt->bindparam(2, $_session['customer_id'], pdo::param_int); $stmt->execute(); $container = array(); $data['result_1'] = $data['result_2'] = ''; while ($row = $stmt->fetch(pdo::fetch_assoc)) { $container[] = "'{$row['itemname']}'"; // put them inside temporary container $data['result_1'] .= ' <div class="col-sm-4 col-md-4"> <div class="content-boxes style-two top-column clearfix animated flipiny" style="opacity: 1;"> <div class="content-boxes-text"> <form action="php/edit.php" method="post" class="form-inline pull-right"> <h3>' . $row['itemname'] . '</h3> <h4>total price: $'.$row['price'].'</h4> <img src="../wholesale/img/sourdough.jpg" class="img-reponsive"> <p>our best seller. full of flavour.</p> <div class="form-group"> <label class="sr-only" for="exampleinputamount">qty</label> <div class="input-group"> <input type="number" name="qty" class="form-control" id="exampleinputamount" value="' . $row['qty'] . '"> </div> </div> <input type="hidden" name="id" value="'.$row['id'].'"> <button type="submit" name="update" class="btn btn-primary">update</button> <button type="submit" name="delete" class="btn btn-primary">remove</button> </form> </div> <!-- //.content-boxes-text --> </div> <!-- //.content-boxes --> </div> '; } if(!empty($container)){ $excluded_names = implode(',', $container); $sql = "select * item itemname not in($excluded_names)"; $stmt = $conn->prepare($sql); $stmt->execute(); while ($row = $stmt->fetch(pdo::fetch_assoc)) { $price =""; if ($_session['customer_band'] == 'a') { $price = $row['banda']; } else if ($_session['customer_band'] == 'b') { $price = $row['bandb']; } else if ($_session['customer_band'] == 'c') { $price = $row['bandc']; } else if ($_session['customer_band'] == 'd') { $price = $row['bandd']; } else if ($_session['customer_band'] == 'e') { $price = $row['bande']; } $data['result_2'] .= ' <div class="col-sm-4 col-md-4"> <div class="content-boxes style-two top-column clearfix animated flipiny" style="opacity: 1;"> <div class="content-boxes-text"> <form action="php/additem.php" method="post" class="form-inline pull-right"> <h4>'.$row['itemname'].'</h4><input id="itemname" type="hidden" name="itemname" value="'.$row['itemname'].'"> <h3>$'.$price.'</h3><input id="price" type="hidden" name="pricetotal" value="'.$price.'"> <img src="../wholesale/img/sourdough.jpg" class="img-reponsive"> <p>'.$row['description'].'</p><input id="description" type="hidden" name="description" value="'.$row['description'].'"> <div class="form-group"> <label class="sr-only" for="exampleinputamount">qty</label> <div class="input-group"> <input id="qty" type="number" name="qty" class="form-control" id="exampleinputamount" placeholder="how many?"> </div> </div> <button type="submit" id="additem" class="btn btn-primary">add</button> </form> </div> <!-- //.content-boxes-text --> </div> <!-- //.content-boxes --> </div> '; } } else { $sql = "select * item"; $stmt = $conn->prepare($sql); $stmt->execute(); while ($row = $stmt->fetch(pdo::fetch_assoc)) { $price =""; if ($_session['customer_band'] == 'a') { $price = $row['banda']; } else if ($_session['customer_band'] == 'b') { $price = $row['bandb']; } else if ($_session['customer_band'] == 'c') { $price = $row['bandc']; } else if ($_session['customer_band'] == 'd') { $price = $row['bandd']; } else if ($_session['customer_band'] == 'e') { $price = $row['bande']; } $data['result_2'] .= ' <div class="col-sm-4 col-md-4"> <div class="content-boxes style-two top-column clearfix animated flipiny" style="opacity: 1;"> <div class="content-boxes-text"> <form action="php/additem.php" method="post" class="form-inline pull-right"> <h4>'.$row['itemname'].'</h4><input type="hidden" name="itemname" value="'.$row['itemname'].'"> <h3>$'.$price.'</h3><input type="hidden" name="pricetotal" value="'.$price.'"> <img src="../wholesale/img/sourdough.jpg" class="img-reponsive"> <p>'.$row['description'].'</p><input type="hidden" name="description" value="'.$row['description'].'"> <div class="form-group"> <label class="sr-only" for="exampleinputamount">qty</label> <div class="input-group"> <input type="number" name="qty" class="form-control" id="exampleinputamount" placeholder="how many?"> </div> </div> <button type="submit" id="additem" class="btn btn-primary">add</button> </form> </div> <!-- //.content-boxes-text --> </div> <!-- //.content-boxes --> </div> '; } } echo json_encode($data); exit;
both update , delete php file:
include('db_config.php'); if (isset($_post['update'])) { $qty = $_post['qty']; $id = $_post['id']; echo $id; $sql = "update orders set qty=? id=?"; $stmt = $conn->prepare($sql); $stmt->execute(array($qty,$id)); header('location: ../order.php'); } if (isset($_post['delete'])) { $id = $_post['id']; $sql = "delete orders id=?"; $stmt = $conn->prepare($sql); $stmt->execute(array($id)); header('location: ../order.php'); }
the code above needs converted ajax, , both sections on page using ajax should update table automatically. might call first ajax query reload tables correctly?
thanks having @ this. having trouble wrapping head around how should work.
alex
it easy can give class (note : yes class ) update button , delete button
suppose update button has class "update_task"
but content added dom after dom loaded, need create 2 ajax request delegate methods delete , update.
for delegate reference - http://api.jquery.com/delegate/
// update
$("body").delegate(".update_task","click",function(){ current_id = $(this).previous("input:hidden").val() // current update button id, $.ajax({ type: 'post', url: 'php/update_product.php', data: {id: current_id, othervalues: other_value_of_choice}, datatype: 'json', success: function(data) { if(data==1) { // ever want if data has been updated } } }); });
Comments
Post a Comment