man5 Posted April 13, 2014 Share Posted April 13, 2014 All I want to do is simply delete a record/row using ajax. For the life of me, I can't get it to work. I have tried many different methods and played around with them. Here is a basic example. Please do tell me what's wrong with it and how I can fix it. index.php <html> <head> <title>Home page</title> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script> $(document).ready(function() { $(function() { $(".del-action").click(function() { var commentContainer = $(this).parent(); var id = $(this).attr("id"); var string = 'id='+ id ; $.ajax({ type: "GET", url: "delete.php", data: string, cache: false, }); }); </script> </head> <body> <?php $get = DB::getInstance()->query("SELECT * FROM records WHERE record_id = 28 "); if(!$get->count()) { echo 'no record found!'; } else { foreach($get->results() as $row) { $record_id = $row->record_id; ?> <div class="record"> <a href="#" class="del-action" id="<?php echo $record_id; ?>" >Delete</a> </div> <?php } } ?> </body> </html> delete.php $record_id = intval($_GET['id']); $delete = DB::getInstance()->delete('records', array('record_id', '=', $record_id)); ps. it deletes the records fine without ajax/js. I just need help with the js code so that I can delete the record without redirecting or refreshing the page. Link to comment https://forums.phpfreaks.com/topic/287725-man-javascriptajax-is-tricky-can-you-help-me-finish-this-code/ Share on other sites More sharing options...
denno020 Posted April 13, 2014 Share Posted April 13, 2014 First step would be to debug whether clicking .del-action does anything. Open up the Network tab in either Chrome DevTools or Firebug (depening on the browser you're using), then click on the delete button. You should see the delete.php page show up in the network tab as soon as you press that button. The first thing I'm noticing is: $(function(){ }); inside $(document).ready(function(){ }); I'm not sure if that affects anything, or why you would need it.. Try changing your JS to: $(document).ready(function() { $(".del-action").click(function() { var commentContainer = $(this).parent(); var id = $(this).attr("id"); var string = 'id='+ id ; $.ajax({ type: "GET", url: "delete.php", data: string, cache: false, }); }); }); I think I've got the brackets right there.. :/ Oh and I think you should set up your data parameter in your ajax call like this data: {id: id} //don't use the string var But I may be wrong about that, it might work both ways.. Link to comment https://forums.phpfreaks.com/topic/287725-man-javascriptajax-is-tricky-can-you-help-me-finish-this-code/#findComment-1475930 Share on other sites More sharing options...
man5 Posted April 13, 2014 Author Share Posted April 13, 2014 First step would be to debug whether clicking .del-action does anything. Open up the Network tab in either Chrome DevTools or Firebug (depening on the browser you're using), then click on the delete button. You should see the delete.php page show up in the network tab as soon as you press that button. The first thing I'm noticing is: $(function(){ }); inside $(document).ready(function(){ }); I'm not sure if that affects anything, or why you would need it.. Try changing your JS to: $(document).ready(function() { $(".del-action").click(function() { var commentContainer = $(this).parent(); var id = $(this).attr("id"); var string = 'id='+ id ; $.ajax({ type: "GET", url: "delete.php", data: string, cache: false, }); }); }); I think I've got the brackets right there.. :/ Oh and I think you should set up your data parameter in your ajax call like this data: {id: id} //don't use the string var But I may be wrong about that, it might work both ways.. Perfect. I got it working. And yes both work, var string and data id. I am using data id as you advised. Thank you! Link to comment https://forums.phpfreaks.com/topic/287725-man-javascriptajax-is-tricky-can-you-help-me-finish-this-code/#findComment-1475933 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.