Solved

confirm popup before record delete takes place

Posted on 2016-11-25
87
20 Views
Last Modified: 2016-11-26
I had this question after viewing How to have a form post to one page or another depending on what button was pressed.

When I was using ajax I was able to do this but had other issues which made me resort to going back to using php instead. Now I am faced with the problem that if you click "delete", the record is just deleted. This isn't great because the user might click it by accident or realize they don't want to delete it but then it's too late.

Is there a way to get a popup that lets you click cancel/confirm and then only do something from there? At the moment when you click delete it is posting the form. I need the popup first and then only should the form post if the user confirms. I don't know if this is possible without using ajax/javascript/jquery?
0
Comment
Question by:Black Sulfur
  • 43
  • 43
87 Comments
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Without jquery/javascript/ajax you can't manage client-side events and an alert to ask an user action (laike a confirmation) are client-side event.
For this kind of tasks I usually use Sweetalert
There is an example which ask exactly for a user confirmation before to delete:
swal({
  title: 'Are you sure?',
  text: "You won't be able to revert this!",
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, delete it!'
}).then(function () {
  swal(
    'Deleted!',
    'Your file has been deleted.',
    'success'
  )
})

Open in new window

So you should implement it this way
$('<delete_button_id>').on('click', function(e){
e.preventDefault();
swal({
  title: 'Are you sure?',
  text: "You won't be able to revert this!",
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, delete it!'
}).then(function () {
    $('<form_id>').submit();
})
});

Open in new window


You have to replace <delete_button_id> with the id of you delete button and with the id of your form (both preceeded by '#') and you go.
If you are using classes to identify your delete buttons you have to manage the code to get the exact record id to delete, but this depend on exactly you implemented your table markup and your code.
If you still need help, please post back here the actual code and the markup of our table.
1
 
LVL 108

Expert Comment

by:Ray Paseur
Comment Utility
I like Marco's answer!  It's probably the best, but it also helps to understand the underlying technologies.  The general design showing the standard CRUD / HTTP requests is shown in this article.
https://www.experts-exchange.com/articles/12335/PHP-and-MySQLi-Table-Maintenance.html
0
 

Author Comment

by:Black Sulfur
Comment Utility
Thank you,

This doesn't seem to work 100% though. I changed the names and used a class for instead of id for the button, and used an id for the form. The sweet alert pops up but if I click on "yes, delete it", the form doesn't actually submit. Here is the sweet alert:

$('.delete').on('click', function(e){
e.preventDefault();
swal({
  title: 'Are you sure?',
  text: "You won't be able to revert this!",
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, delete it!'
}).then(function () {
    $('#locForm').submit();
})
});

Open in new window


here is the form.

	$showLocation = <<<EOD
		<form method="post" action="formhandler.php" id="locForm">
		<tr>
		<td> <input type="category" name="locationName" value="$locationName"></td>
		<td></td>
		<td></td>
		<td></td>
		<td><input type="submit" name="action" class="btn btn-xs btn-fill btn-warning" value="Edit" id="edit"><input type="hidden" name="locationId" value="$locationId"></td>
		<td><input type="submit" name="action" class=" delete btn btn-xs btn-fill btn-danger" value="Delete" id="delete"><input type="hidden" name="locationId" value="$locationId"></td>
		</tr>
		</form>
		
EOD;
echo $showLocation;

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
That is a table where you have, I suppose, as many forms as are the rows in the table. Did you give them a different id? But we don't need id at all, if you're using class. We have instead to get the form where the button is:
$('.delete').on('click', function(e){
e.preventDefault();
var $thisForm = $(this).parents('form');
swal({
  title: 'Are you sure?',
  text: "You won't be able to revert this!",
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, delete it!'
}).then(function () {
    $thisForm.submit();
})
});

Open in new window

This should work. You can remove the id from the form.
0
 

Author Comment

by:Black Sulfur
Comment Utility
Just checked console. The error is:

Uncaught TypeError: Cannot read property 'then' of undefined at HTMLInputElement.<anonymous>

No idea what that means?
0
 

Author Comment

by:Black Sulfur
Comment Utility
I changed the code to your latest post but it still isn't posting, it just closes the sweet alert and I am still getting the console error as per my last post when I click on delete. Not sure if you need some more code as maybe I am leaving something out?
0
 

Author Comment

by:Black Sulfur
Comment Utility
I don't know what you think about this, but I tried it and I get no console error and the form posts to the formhandler.php page as it is supposed to but it just hangs there. It doesn't perform the php like it should.


$('.delete').on('click', function(e){
e.preventDefault();
var $thisForm = $(this).parents('form');
swal({
  title: 'Are you sure?',
  text: "You won't be able to revert this!",
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, delete it!'
},
	  function(isConfirm) {
	  if (isConfirm) {
    $('#locform').submit();
}
})
});

Open in new window


$_SESSION['refer'] = "SA";

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'Edit') {
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
	header("location:locations.php");
	
}

else if ($action == 'Delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
	header("location:locations.php");
}

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Let me do a test to suppress that error. If you have many forms with the same id it can't work: the id must be unique. If you set a different id for each ro you have to write one event handler per row and this is a bad design. Give me some minute, please.
0
 

Author Comment

by:Black Sulfur
Comment Utility
Oh, I think I understand what you are saying and I think you are correct. The form is inside a while loop:

function display_locations($link) {
$stmt = $link->prepare("SELECT `location_id`, `location_name` FROM `location` ORDER BY `location_name` ASC");
$stmt->execute();
$result = $stmt->get_result();
$numRows = $result->num_rows;
	if($numRows > 0){
		while($row = $result->fetch_assoc()){
			
			$locationId = htmlentities($row['location_id'], ENT_QUOTES, "UTF-8");
			$locationName = htmlentities($row['location_name'], ENT_QUOTES, "UTF-8");
			$showLocation = <<<EOD
		<form id="locdelete" action="formhandler.php" method="post">
		<tr>
		<td> <input type="category" name="locationName" value="$locationName"></td>
		<td></td>
		<td></td>
		<td></td>
		<td><input type="submit" name="action" class="btn btn-xs btn-fill btn-warning" value="Edit" id="edit"><input type="hidden" name="locationId" value="$locationId"></td>
		<td><input type="submit" name="action" class="delete btn btn-xs btn-fill btn-danger" value="Delete"><input type="hidden" name="locationId" value="$locationId"></td>
		</tr>
		</form>
		
EOD;
echo $showLocation;
		}
	}
}

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
Alright, now that I have taken the form out of the loop and I changed the form id as well just to make sure it's unique (just in case), the form posts. But I still have the problem where the execution just stops on the formhandler.php page and doesn't delete the record and then redirect. In other words, this page does not actually do what it used to do before I just the confirm popup.

$_SESSION['refer'] = "SA";

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'Edit') {
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
	header("location:locations.php");
	
}

else if ($action == 'Delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
	header("location:locations.php");
}

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
So, to clarify, the table now looks like this:

<table class="table table-hover table-striped">
	<thead>
		<th>Locations</th>
		<th></th>
		<th></th>
		<th></th>
		<th></th>
		<th></th>
	</thead>
	<tbody>
		<form id="locdelete" action="formhandler.php" method="post">
			<?php display_locations($link); ?>
		</form>
	</tbody>
</table>

Open in new window


The function
<?php display_locations($link); ?>

Open in new window

looks like this

function display_locations($link) {
$stmt = $link->prepare("SELECT `location_id`, `location_name` FROM `location` ORDER BY `location_name` ASC");
$stmt->execute();
$result = $stmt->get_result();
$numRows = $result->num_rows;
	if($numRows > 0){
		while($row = $result->fetch_assoc()){
			
			$locationId = htmlentities($row['location_id'], ENT_QUOTES, "UTF-8");
			$locationName = htmlentities($row['location_name'], ENT_QUOTES, "UTF-8");
			$showLocation = <<<EOD

		<tr>
		<td> <input type="category" name="locationName" value="$locationName"></td>
		<td></td>
		<td></td>
		<td></td>
		<td><input type="submit" name="action" class="btn btn-xs btn-fill btn-warning" value="Edit"><input type="hidden" name="locationId" value="$locationId"></td>
		<td><input type="submit" name="action" class="delete btn btn-xs btn-fill btn-danger" value="Delete"><input type="hidden" name="locationId" value="$locationId"></td>
		</tr>
		
EOD;
echo $showLocation;
		}
	}
}

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Unfortnately, I have to say you have to correct several things.
The first one is tha form position: it is not allowed to have form as child element of a table, a tbody or a tr, so or you put a different form in each column (bad) or you put oly one form around the table (good).
So this change prevent us to just submit the form: it is more convenient to use a ajax call to post data to our script.
So this should looks your markup for the table - really simplified: I let to you to rebuild the markup the right way :)
					<form method="post" action="formhandler.php">
						
						<table>
$showLocation = <<<EOD
							<tr>

								<td> <input type="category" name="locationName" value="1"></td>
								<td></td>
								<td></td>
								<td></td>
								<td><input type="submit" name="action" data-action="edit" data-location-name="$locationName" data-location-id="$locationId" class="btn btn-xs btn-fill btn-warning" value="Edit"></td>
								<td><input type="submit" name="action" data-action="delete" data-location-name="$locationName" data-location-id="$locationId" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>

							</tr>
EOD;
						</table>
					</form>			

Open in new window

Obviously you have to adjust to fit your loop. Notice that the form starts before the table and ends after it: it wraps the whole table. Notice even how I removed hidden fields and added two data attribute to each button: data-action and data-location. We'll use these data to identify the button the user clicked on in our script.
Now the Javascript. We have to get the button which user clicked on to pass correct data to our php script:
			$(document).ready(function ( ) {
				$('.delete').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
                                        var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($thisForm);
					swal({
						title: 'Are you sure?',
						text: "You won't be able to revert this!",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#3085d6',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, delete it!'
					}).then(function () {
						$.ajax({
							type: 'post',
							url: 'formhandler.php',
							data: {locationName: $locationName, locationId: $locationId, action: $action},
							success: function (result) {
                                                             if (result == 'success'){
								window.location.href = 'locations.php';
                                                             }
							},
							error: function (jqXHR, textStatus, errorThrown) {
								console.log(textStatus, errorThrown);
							}
						});
					});
				});

			});

Open in new window

We are no more interested to get the form. We want action and location id instead. Then we pass these data to our script:
$_SESSION['refer'] = "SA";

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'Edit') {
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
echo 'success';
}

else if ($action == 'Delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
echo 'success';
}

Open in new window

I removed header instructions because this is managed by javascript with window.location.href. Hope this helps.
0
 

Author Comment

by:Black Sulfur
Comment Utility
Thank you Marco, just a quick question about your table code though:

					<form method="post" action="formhandler.php">
						
						<table>
$showLocation = <<<EOD
							<tr>

								<td> <input type="category" name="locationName" value="1"></td>
								<td></td>
								<td></td>
								<td></td>
								<td><input type="submit" name="action" data-action="edit" data-location-name="$locationName" data-location-id="$locationId" class="btn btn-xs btn-fill btn-warning" value="Edit"></td>
								<td><input type="submit" name="action" data-action="delete" data-location-name="$locationName" data-location-id="$locationId" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>

							</tr>
EOD;
						</table>
					</form>	

Open in new window


You have not included the table head. If I put the table head into the loop it is going to look horrible as it is going to repeat the table head with every record. How can I get around that?

<table class="table table-hover table-striped">
	<thead>
		<th>Locations</th>
		<th></th>
		<th></th>
		<th></th>
		<th></th>
		<th></th>
	</thead>
	<tbody>
		<form id="locdelete" action="formhandler.php" method="post">
			<?php display_locations($link); ?>
		</form>
	</tbody>
</table>

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Yes :D, horrible. You have to put just rows in the loop:
<form>
    <table>
        <thead>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
           <th></th>
       </thead>
       <tbody>
            loop here
      </tbody>
<t/able>
</form>

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
Marco, thank you for your patience. I am still struggling to understand the form part. Your code looks like it is within the php function that uses the HEREDOC but I cannot use html like you inside the php function i.e.: the form <form method="post" action="formhandler.php">

                        
	<form method="post" action="formhandler.php">
						
						<table>
$showLocation = <<<EOD
							<tr>

								<td> <input type="category" name="locationName" value="1"></td>
								<td></td>
								<td></td>
								<td></td>
								<td><input type="submit" name="action" data-action="edit" data-location-name="$locationName" data-location-id="$locationId" class="btn btn-xs btn-fill btn-warning" value="Edit"></td>
								<td><input type="submit" name="action" data-action="delete" data-location-name="$locationName" data-location-id="$locationId" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>

							</tr>
EOD;
						</table>
					</form>	

Open in new window


Obviously I cannot use my below code because the form is looping with each record and that is wrong.

function display_locations($link) {
$stmt = $link->prepare("SELECT `location_id`, `location_name` FROM `location` ORDER BY `location_name` ASC");
$stmt->execute();
$result = $stmt->get_result();
$numRows = $result->num_rows;
	if($numRows > 0){
		while($row = $result->fetch_assoc()){
			
			$locationId = htmlentities($row['location_id'], ENT_QUOTES, "UTF-8");
			$locationName = htmlentities($row['location_name'], ENT_QUOTES, "UTF-8");
			
		$showLocation = <<<EOD
		<form method="post" action="formhandler.php" id="locForm">
		<tr>
		<td> <input type="category" name="locationName" value="$locationName"></td>
		<td></td>
		<td></td>
		<td></td>
		<td><input type="submit" name="action" class="btn btn-xs btn-fill btn-warning" value="Edit" id="edit"><input type="hidden" name="locationId" value="$locationId"></td>
		<td><input type="submit" name="action" class=" delete btn btn-xs btn-fill btn-danger" value="Delete" id="delete"><input type="hidden" name="locationId" value="$locationId"></td>
		</tr>
		</form>
		
EOD;
echo $showLocation;
		}
	}
}

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
I tried to put the form around the table like this:

<form id="locdelete" action="formhandler.php" method="post">
<table class="table table-hover table-striped">
	<thead>
		<th>Locations</th>
		<th></th>
		<th></th>
		<th></th>
		<th></th>
		<th></th>
	</thead>
	<tbody>
<?php display_locations($link); ?>
	</tbody>
</table>
	</form>

Open in new window


I am not sure if that is what you meant? I then have the function inside the table
<?php display_locations($link); ?>

Open in new window


Is that what you meant?
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
That looks good. I was asking where you code the table because there is no table markup in your loop, only tr and td.. But this should be fine. Let me know if you still have problems.
0
 

Author Comment

by:Black Sulfur
Comment Utility
Yes, no matter what record I click on when clicking edit it shows the exact same record every time which is wrong. It always shows the last displayed record of the table. i have used echo in the php to see what record  is showing. Here is all my code for now so you can see everything:

php function:

function display_locations($link) {
$stmt = $link->prepare("SELECT `location_id`, `location_name` FROM `location` ORDER BY `location_name` ASC");
$stmt->execute();
$result = $stmt->get_result();
$numRows = $result->num_rows;
	if($numRows > 0){
		while($row = $result->fetch_assoc()){
			
			$locationId = htmlentities($row['location_id'], ENT_QUOTES, "UTF-8");
			$locationName = htmlentities($row['location_name'], ENT_QUOTES, "UTF-8");
//			$postform = htmlspecialchars($_SERVER["PHP_SELF"]);
			
		$showLocation = <<<EOD

		<tr>
		<td> <input type="category" name="locationName" value="$locationName"></td>
		<td></td>
		<td></td>
		<td></td>
		<td><input type="submit" name="action" data-action="edit" data-location-name="$locationName" data-location-id="$locationId" class="btn btn-xs btn-fill btn-warning" value="Edit"></td>
		<td><input type="submit" name="action" data-action="delete" data-location-name="$locationName" data-location-id="$locationId" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>
		</tr>

		
EOD;
echo $showLocation;
		}
	}
}

Open in new window


Form:

<form id="locdelete" action="formhandler.php" method="post">
<table class="table table-hover table-striped">
	<thead>
		<th>Locations</th>
		<th></th>
		<th></th>
		<th></th>
		<th></th>
		<th></th>
	</thead>
	<tbody>
<?php display_locations($link); ?>
	</tbody>
</table>
	</form>

Open in new window


javascript/jquery

$(document).ready(function ( ) {
				$('.delete').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
                                        var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($thisForm);
					swal({
						title: 'Are you sure?',
						text: "You won't be able to revert this!",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#3085d6',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, delete it!'
					}).then(function () {
						$.ajax({
							type: 'post',
							url: 'formhandler.php',
							data: {locationName: $locationName, locationId: $locationId, action: $action},
							success: function (result) {
                                                             if (result == 'success'){
								window.location.href = 'locations.php';
                                                             }
							},
							error: function (jqXHR, textStatus, errorThrown) {
								console.log(textStatus, errorThrown);
							}
						});
					});
				});

			});

Open in new window



$_SESSION['refer'] = "SA";

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'Edit') {
	
	echo $_POST['locationName'];
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
echo 'edit success';
}

else if ($action == 'Delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
echo 'delete success';
}

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Ok. Give me a minute (or more...)
0
 

Author Comment

by:Black Sulfur
Comment Utility
Thanks so much!
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Please check the output of the loop: are the values for $locationName and $locationId correct for each row?
0
 

Author Comment

by:Black Sulfur
Comment Utility
I am not sure how to check that? I looked at the page source and all the correct id numbers are there and location names.

in other words, data-location-name="$locationName" data-location-id="$locationId" are correct if I view the page source.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
I would appreciate if you can copy and aste here 3/4 rows (html markup) produced by the loop so I can do some test
0
 

Author Comment

by:Black Sulfur
Comment Utility
Do you mean the html output like this?

<tr>
            <td> <input type="category" name="locationName" value="Africa"></td>
            <td></td>
            <td></td>
            <td></td>
            <td><input type="submit" name="action" data-action="edit" data-location-name="Africa" data-location-id="19" class="btn btn-xs btn-fill btn-warning" value="Edit"></td>
            <td><input type="submit" name="action" data-action="delete" data-location-name="Africa" data-location-id="19" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>
            </tr>

            
            <tr>
            <td> <input type="category" name="locationName" value="Britain"></td>
            <td></td>
            <td></td>
            <td></td>
            <td><input type="submit" name="action" data-action="edit" data-location-name="Britain" data-location-id="25" class="btn btn-xs btn-fill btn-warning" value="Edit"></td>
            <td><input type="submit" name="action" data-action="delete" data-location-name="Britain" data-location-id="25" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>
            </tr>

            
            <tr>
            <td> <input type="category" name="locationName" value="USA"></td>
            <td></td>
            <td></td>
            <td></td>
            <td><input type="submit" name="action" data-action="edit" data-location-name="USA" data-location-id="5" class="btn btn-xs btn-fill btn-warning" value="Edit"></td>
            <td><input type="submit" name="action" data-action="delete" data-location-name="USA" data-location-id="5" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>
            </tr>
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
But in html this line
data-location-name="$locationName" data-location-id="$locationId" 

Open in new window

should be something like
data-location-name="Whashington" data-location-id="1" 

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Perfect, thank you
0
 
LVL 30

Accepted Solution

by:
Marco Gasi earned 500 total points
Comment Utility
First, be sure to respect case-sensitive. If in your php script you check for $action = 'Edit', put 'Edit' even in your data-action attribute instead of 'edit'. I'm using lowercase variables in my examples.

There was an error in my sweetalercode (I really don't know why I posted a wrong piece of code!). This the new one.

				$('.delete').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					swal({
						title: 'Are you sure?',
						text: "You won't be able to revert this!",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#3085d6',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, delete it!'
					}, function (isConfirm) {
						if (isConfirm) {
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
									alert(result);
								},
								error: function (jqXHR, textStatus, errorThrown) {
									console.log(textStatus, errorThrown);
								}
							});
						}else{
							console.log('cancelled');
						}
					});
				});

Open in new window


In formhandler.php (remember uppercase/lowercase) you don't need to check for edit success or delete success since the final action is to go to locations.php (unless you plan to do different actions.

Here you can see a working example where php scrippt doesn't perform any database op but it just return the action type and the locationName which is alerted: http://test.webintenerife.com/confirmDelete.html

HTH :)
0
 

Author Comment

by:Black Sulfur
Comment Utility
Okay, getting somewhere now! Should I replace your

alert(result);

Open in new window


with

window.location.href = 'locations.php'; 

Open in new window


otherwise the record doesn't show as deleted until I refresh the page.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Yes of course, that was a my test leftover :) Sorry
0
 

Author Comment

by:Black Sulfur
Comment Utility
Okay, the delete seems to be working well now. Thanks so much! The edit is the only thing that is still not working. If I click on edit it goes to formhandler.php and I just get a blank page there.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
edit vs Edit?
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Show me current code, please
0
 

Author Comment

by:Black Sulfur
Comment Utility
Both edits are lowercase as far as I can see.

$_SESSION['refer'] = "SA";

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'edit') {
	
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
		header("location:locations.php");
}

else if ($action == 'delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
}

Open in new window


$showLocation = <<<EOD

		<tr>
		<td> <input type="category" name="locationName" value="$locationName"></td>
		<td></td>
		<td></td>
		<td></td>
		<td><input type="submit" name="action" data-action="edit" data-location-name="$locationName" data-location-id="$locationId" class="btn btn-xs btn-fill btn-warning" value="Edit"></td>
		<td><input type="submit" name="action" data-action="delete" data-location-name="$locationName" data-location-id="$locationId" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>
		</tr>

		
EOD;
echo $showLocation;

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
In your edit button 'edit' class is missing. Since I suppose you have bound the event the same way we did for delete, you $('delete').on('click'...
should just fail. How it is the code for show the alert for edit button?
0
 

Author Comment

by:Black Sulfur
Comment Utility
Oh, no. Didn't realize I needed the ajax call for the edit button as well! is that what you are saying?
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Of course. You should also use just one class 'action' and then check if data-action is edit or delete and act accordingly, but this later, maybe.
Start to create the event handler for edit button.

1) add class 'edit' to the button class attribute
2) copy the javascript used to delete button and paste it below
3) change the text for sweetalert

Done
0
 

Author Comment

by:Black Sulfur
Comment Utility
I tried this:

$(document).ready(function() {
$('.delete').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					swal({
						title: 'Are you sure?',
						text: "You won't be able to undo this!",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#FB404B',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, delete it!'
					}, function (isConfirm) {
						if (isConfirm) {
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
									window.location.href = 'locations.php'; 
								},

							});
						}else{
							console.log('cancelled');
						}
					});
				});

	
	$('.edit').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					swal({
						title: 'Are you sure?',
						text: "You won't be able to revert this!",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#3085d6',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, delete it!'
					}, function (isConfirm) {
						if (isConfirm) {
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
									window.location.href = 'locations.php'; 
								},
								error: function (jqXHR, textStatus, errorThrown) {
									console.log(textStatus, errorThrown);
								}
							});
						}else{
							console.log('cancelled');
						}
					});
				});
		})

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
And...?
0
 

Author Comment

by:Black Sulfur
Comment Utility
I tried without sweet alert as well. It redirects back to the locations page as it should be not sweet alert is triggered like the delete success and the record doesn't actually update. So, there is something not 100% here.

	$(document).ready(function() {
$('.delete').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					swal({
						title: 'Are you sure?',
						text: "You won't be able to undo this!",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#FB404B',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, delete it!'
					}, function (isConfirm) {
						if (isConfirm) {
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
									window.location.href = 'locations.php'; 
								},

							});
						}else{
							console.log('cancelled');
						}
					});
				});

	
	$('.edit').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
			
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
									window.location.href = 'locations.php'; 
								},
								error: function (jqXHR, textStatus, errorThrown) {
									console.log(textStatus, errorThrown);
								}
							});
						})
					});

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
In my test page it works: if you take a look at the alert test you'll see it is different depending on edit or delete action fired
0
 

Author Comment

by:Black Sulfur
Comment Utility
Okay, the console is showing correct data, the alert however is showing a lot of code!

<!doctype html>
      <html lang="en">

      <head>
            <meta charset="utf-8" />
            <link rel="icon" type="image/png" href="assets/img/favicon.ico">

And that is just a little of it.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Obvious: you don't have deleted header statement for edit in  your php
0
 

Author Comment

by:Black Sulfur
Comment Utility
Obvious: you don't have deleted header statement for edit in  your php

Sorry, I don't know what that means? But if you are talking about the location header then I see that, yes. I took it out.

$_SESSION['refer'] = "SA";

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'edit') {
	
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
	
}

else if ($action == 'delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
}

Open in new window


And now my javascript:

$(document).ready(function() {
$('.delete').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					swal({
						title: 'Are you sure?',
						text: "You won't be able to undo this!",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#FB404B',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, delete it!'
					}, function (isConfirm) {
						if (isConfirm) {
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
									window.location.href = 'locations.php'; 
								},

							});
						}else{
							console.log('cancelled');
						}
					});
				});

	
	$('.edit').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
			
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
									window.location.href = 'locations.php'; 
//									alert(result);
								},
								error: function (jqXHR, textStatus, errorThrown) {
									console.log(textStatus, errorThrown);
								}
							});
						})
					});

Open in new window


This does everything correctly except actually update the record.
0
Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Your current script is
$_SESSION['refer'] = "SA";

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'edit') {
	
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
		header("location:locations.php");
}

else if ($action == 'delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
}

Open in new window

Just remove line 11.

As  a side note, I saw that both buttons have name='action': if you give the same name to different elements you must use array notation, but you don't need to put name attribute because everything is managed by javascript. Anyway, keep in mind that name, as id  must be unique
0
 

Author Comment

by:Black Sulfur
Comment Utility
Yes, I did remove line 11. Okay, let me take a look at that in a bit.
0
 

Author Comment

by:Black Sulfur
Comment Utility
If I don't name both buttons called action then this won't work?

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'edit') {

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Mmmhh. Another side note: why are you using LIMIT 1? Do you have more than one ecord with the same location id?
0
 

Author Comment

by:Black Sulfur
Comment Utility
I am using LIMIT 1 because I only want one record to be deleted and double sure that only 1 can be deleted by using LIMIT 1. I think it works like that anyway.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Yes that work because everything is post through ajax:
data: {locationName: $locationName, locationId: $locationId, action: $action}

Open in new window


Try to remove LIMIT clause from update statement: LIMIT can be used with UPDATE but with the row count only
0
 

Author Comment

by:Black Sulfur
Comment Utility
If I look at your html, both edit and delete have name of action?

<td><input type="submit" name="action" data-action="edit" data-location-name="Africa" data-location-id="19" class="edit btn btn-xs btn-fill btn-warning" value="Edit"></td>
                                                <td><input type="submit" name="action" data-action="delete" data-location-name="Africa" data-location-id="19" class="delete btn btn-xs btn-fill btn-danger" value="Delete"></td>
0
 

Author Comment

by:Black Sulfur
Comment Utility
Noted. I removed the limit 1 but still no luck.

$_SESSION['refer'] = "SA";

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'edit') {
	
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ?");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
	
}

else if ($action == 'delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
}

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Yes. I copied yours :D
name attribute is not the problem, but first it's incorrect markup having 2 elements with identival names, second here you don't need because name is needed if you post form through php but we are posting through ajax so you can remove them.

Have you removed LIMIT for update? I suspect it make the query fail
0
 

Author Comment

by:Black Sulfur
Comment Utility
Yes, I did remove the limit 1 as per my previous post but sadly it didn't work.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Our comments are overlapping: I didn't read it. Let me think please. That's strange
0
 

Author Comment

by:Black Sulfur
Comment Utility
Haha, i noticed. I think the problem is trying to slowly convert it from php only to Ajax/php
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Mah, the code is exactly the same and it should work. There's something wrong with the query. Let me see how to return the parametrized query to alert it instead of going to locations.php
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Ok, we can try to use this function found on PHP man page for PDO debug (http://php.net/manual/it/pdostatement.debugdumpparams.php#118492):
function pdo_debugStrParams($stmt) {
  ob_start();
  $stmt->debugDumpParams();
  $r = ob_get_contents();
  ob_end_clean();
  return $r;
}

Open in new window


So change your php script this way:
$_SESSION['refer'] = "SA";

function pdo_debugStrParams($stmt) {
  ob_start();
  $stmt->debugDumpParams();
  $r = ob_get_contents();
  ob_end_clean();
  return $r;
}

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'edit') {
	
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ?");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
	
}

else if ($action == 'delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
}
$debugQuery = '<pre>'.htmlspecialchars(pdo_debugStrParams($stmt)).'</pre>';
echo $debugQuery;

Open in new window


In you javascript for edit button comment out the location.href and leave only alert(result) or console.log(result), so you can copy and paste it here. Try to see what's the output.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Also add these lines at the very top of the php script
error_reporting(E_ALL);
ini_set('display_errors', 'On');

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
I have to leave the computer for a while. I'll come back to you later, as soon as possible :)
0
 

Author Comment

by:Black Sulfur
Comment Utility
I get this error:

Fatal error</b>:  Uncaught Error: Call to undefined method mysqli_stmt::debugDumpParams()

But I am not using PDO, I am using mysqli prepared statements.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Ah ah ah, okay, then drop that functio and try this instead:

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'edit') {
	
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ?");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
                $query = $stmt->__toString();
		$stmt->execute();
		$stmt->close();
	
}

else if ($action == 'delete') {
	
		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
}
echo $query;

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
This is working fine up until here. I can see in the console that all the info is correct no matter which record I click on.

$('.edit').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);

Open in new window


So, the problem is from here in the javascript or in the actual php code:

$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
//									window.location.href = 'locations.php'; 
									alert(result);
								},

							});

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
I get:

<b>Fatal error</b>:  Uncaught Error: Call to undefined method mysqli_stmt::__toString()
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
But that code is identical to the one we use for delete so the issue is in the database query. We have to get the error
0
 

Author Comment

by:Black Sulfur
Comment Utility
I don't understand how the database query can be wrong because it is exactly the same one I used right at the beginning before  Even started trying to use Ajax/jquery and it worked just fine.

Is the problem not here with this code?

$('.edit').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
			
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
//									window.location.href = 'locations.php'; 
									alert(result);
								},

							});
						});
					});

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
If I do this and echo out the posted name, it alerts the correct name.

$action = isset($_POST['action']) ? $_POST['action'] : false;
if ($action == 'edit') {
	
	
	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ?");
		$stmt->bind_param("si", $_POST['locationName'], $_POST['locationId']);
		$stmt->execute();
		$stmt->close();
	echo $_POST['locationName'];
	
}

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Try this: replace temporarely $_POST with $_REQUEST, then open a new browser tab and put there this:
www.domain.com/formhandler.php?locationName=USA&locationId=5&action=edit

Open in new window

obviously replaing domain.com with the actual domain name and see if php prints out some error
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Try to check locationId
0
 

Author Comment

by:Black Sulfur
Comment Utility
Yes, locationId is also working correctly. So, it is definitely posting the correct information to the formhandler.php page and the page echo's the correct information that was posted.
0
 

Author Comment

by:Black Sulfur
Comment Utility
Try this: replace temporarely $_POST with $_REQUEST

I have a lot of $_POST 's. Which ones in particular would you like me to change to $_REQUEST?
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Really strange...
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Don't worry, you have already checked data are correclty posted to the script and the script correctly receives them...
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Anyway, I meant this.
<?php
error_reporting(E_ALL);
ini_set('display_errors', 'On');
$_SESSION['refer'] = "SA";
$action = isset($_REQUEST['action']) ? $_REQUEST['action'] : false;
if ($action == 'edit') {

	$stmt = $link->prepare("UPDATE `location` SET `location_name` = ? WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("si", $_REQUEST['locationName'], $_REQUEST['locationId']);
		$stmt->execute();
		$stmt->close();
	echo 'edit ' . $_REQUEST['locationName'];
} else if ($action == 'delete') {

		$stmt = $link->prepare("DELETE FROM `location` WHERE `location_id` = ? LIMIT 1");
		$stmt->bind_param("i", $_REQUEST['locationId']);
		$stmt->execute();
		$stmt->close();
	echo 'delete ' . $_REQUEST['locationName'];
}

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
So, here's a question. If I am posting locationName, which is the name of the text input, then surely when I change that text and submit, the echo value should be what I typed in, but it is echoing the old value from the database even though I am telling the page to echo the posted value which should be whatever I type into the text field?
0
 

Author Comment

by:Black Sulfur
Comment Utility
So, we are posting this in the jQuery:

var $locationName = $(this).data('location-name');

Open in new window


which is actually the database record and not the form value? I think!
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Yeah. Or better, nooo. But almost.
We are passing only the value of the old locationName but not the one for the new locationName. Change this part of the javascript for edit button:
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $newLocationName = $(this).parents('tr').find("input[type='category']").val();
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					console.log($newLocationName);

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
My comment was written before I read the yours
0
 

Author Comment

by:Black Sulfur
Comment Utility
Changed that and this:

data: {locationName: $newLocationName, locationId: $locationId, action: $action},

Open in new window


And now it works! Haha, can't believe it was something so simple all along! Anyway, you deserve a million points just for being so patient. Most people would have just given up so thank you so much!!

Just one last question....
0
 

Author Comment

by:Black Sulfur
Comment Utility
Is there a way to "combine" these as they seem like you could use an else statement but I just don't know how. Like, if you clicl edit then run the edit else if you click delete run the delete.

	$(document).ready(function() {
$('.delete').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					swal({
						title: 'Are you sure?',
						text: "You won't be able to undo this!",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#FB404B',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, delete it!'
					}, function (isConfirm) {
						if (isConfirm) {
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
									window.location.href = 'locations.php'; 
								},

							});
						}else{
							console.log('cancelled');
						}
					});
				});

	
	$('.edit').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $newLocationName = $(this).parents('tr').find("input[type='category']").val();
					var $action = $(this).data('action');
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					console.log($newLocationName);
			
							$.ajax({
								type: 'post',
								url: 'formhandler.php',
								data: {locationName: $newLocationName, locationId: $locationId, action: $action},
								success: function (result) {
									window.location.href = 'locations.php'; 
//									alert(result);
								},

							});
						});
					});

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
What a stupid i am!!! I forgot to tell you to put $newLocationName in data!

Replace in your buttons class attribute 'delete' and 'edit' with 'action'.
The the javascript:
				$('.action').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					if ($action == 'edit') {
						var $newLocationName = $(this).parents('tr').find(input[type = 'category']).val();
						var data = {locationName: $newLocationName, locationId: $locationId, action: $action};
					}else{
						var data = {locationName: $locationName, locationId: $locationId, action: $action};
					}
					swal({
						title: 'Are you sure?',
						text: "Do you want to change this record?",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#3085d6',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, edit it!'
					}, function (isConfirm) {
						if (isConfirm) {
							$.ajax({
								type: 'post',
								url: 'confirmDelete.php',
								data: data,
								success: function (result) {
									window.location.href = 'formhandler.php';
								},
								error: function (jqXHR, textStatus, errorThrown) {
									console.log(textStatus, errorThrown);
								}
							});
						} else {
							console.log('cancelled');
						}
					});
				});

Open in new window

0
 

Author Comment

by:Black Sulfur
Comment Utility
Hmm. That doesn't seem to work. Also, I don't have a page called:

url: 'confirmDelete.php',
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
I copied and pasted form my tests, replace with your page :D
0
 

Author Comment

by:Black Sulfur
Comment Utility
Yeah, I already did that like this but it just gets stuck on formhandler.php with a blank page.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
Ullalà, another problem here! Let me see
0
 

Author Comment

by:Black Sulfur
Comment Utility
Let me ask a related question so I can at least award you more points for all your effort.
0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
This works on my page :)
				$('.action').on('click', function (e) {
					e.preventDefault();
					var $locationId = $(this).data('location-id');
					var $locationName = $(this).data('location-name');
					var $action = $(this).data('action');
					if ($action == 'edit') {
						var $newLocationName = $(this).parents('tr').find("input[type = 'category']").val();
						var data = {locationName: $newLocationName, locationId: $locationId, action: $action};
					}else{
						var data = {locationName: $locationName, locationId: $locationId, action: $action};
					}
					console.log($action);
					console.log($locationId);
					console.log($locationName);
					console.log($newLocationName);
					swal({
						title: 'Are you sure?',
						text: "Do you want to change this record?",
						type: 'warning',
						showCancelButton: true,
						confirmButtonColor: '#3085d6',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Yes, edit it!'
					}, function (isConfirm) {
						if (isConfirm) {
							$.ajax({
								type: 'post',
								url: 'confirmDelete.php',
//								url: 'formhandler.php',
								data: {locationName: $locationName, locationId: $locationId, action: $action},
								success: function (result) {
//									window.location.href = 'formhandler.php';
									alert(result);
								},
								error: function (jqXHR, textStatus, errorThrown) {
									console.log(textStatus, errorThrown);
								}
							});
						} else {
							console.log('cancelled');
						}
					});
				});

Open in new window

0
 
LVL 30

Expert Comment

by:Marco Gasi
Comment Utility
0

Featured Post

What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

Join & Write a Comment

Popularity Can Be Measured Sometimes we deal with questions of popularity, and we need a way to collect opinions from our clients.  This article shows a simple teaching example of how we might elect a favorite color by letting our clients vote for …
Password hashing is better than message digests or encryption, and you should be using it instead of message digests or encryption.  Find out why and how in this article, which supplements the original article on PHP Client Registration, Login, Logo…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

7 Experts available now in Live!

Get 1:1 Help Now