Solved

confirm popup before record delete takes place

Posted on 2016-11-25
87
41 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 31

Expert Comment

by:Marco Gasi
ID: 41901710
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
ID: 41901743
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
ID: 41902278
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 31

Expert Comment

by:Marco Gasi
ID: 41902286
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
ID: 41902288
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
ID: 41902292
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
ID: 41902296
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 31

Expert Comment

by:Marco Gasi
ID: 41902298
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
ID: 41902299
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
ID: 41902303
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
ID: 41902307
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 31

Expert Comment

by:Marco Gasi
ID: 41902317
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
ID: 41902321
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 31

Expert Comment

by:Marco Gasi
ID: 41902332
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
ID: 41902334
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
ID: 41902335
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 31

Expert Comment

by:Marco Gasi
ID: 41902339
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
ID: 41902344
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 31

Expert Comment

by:Marco Gasi
ID: 41902348
Ok. Give me a minute (or more...)
0
 

Author Comment

by:Black Sulfur
ID: 41902349
Thanks so much!
0
 
LVL 31

Expert Comment

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

Author Comment

by:Black Sulfur
ID: 41902351
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 31

Expert Comment

by:Marco Gasi
ID: 41902353
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
ID: 41902354
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 31

Expert Comment

by:Marco Gasi
ID: 41902355
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 31

Expert Comment

by:Marco Gasi
ID: 41902356
Perfect, thank you
0
 
LVL 31

Accepted Solution

by:
Marco Gasi earned 500 total points
ID: 41902381
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
ID: 41902405
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 31

Expert Comment

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

Author Comment

by:Black Sulfur
ID: 41902412
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 31

Expert Comment

by:Marco Gasi
ID: 41902415
edit vs Edit?
0
 
LVL 31

Expert Comment

by:Marco Gasi
ID: 41902416
Show me current code, please
0
 

Author Comment

by:Black Sulfur
ID: 41902432
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 31

Expert Comment

by:Marco Gasi
ID: 41902437
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
ID: 41902441
Oh, no. Didn't realize I needed the ajax call for the edit button as well! is that what you are saying?
0
 
LVL 31

Expert Comment

by:Marco Gasi
ID: 41902445
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
ID: 41902446
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 31

Expert Comment

by:Marco Gasi
ID: 41902451
And...?
0
 

Author Comment

by:Black Sulfur
ID: 41902452
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 31

Expert Comment

by:Marco Gasi
ID: 41902453
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
ID: 41902456
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 31

Expert Comment

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

Author Comment

by:Black Sulfur
ID: 41902461
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
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 31

Expert Comment

by:Marco Gasi
ID: 41902465
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
ID: 41902468
Yes, I did remove line 11. Okay, let me take a look at that in a bit.
0
 

Author Comment

by:Black Sulfur
ID: 41902471
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 31

Expert Comment

by:Marco Gasi
ID: 41902472
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
ID: 41902473
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 31

Expert Comment

by:Marco Gasi
ID: 41902476
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
ID: 41902477
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
ID: 41902479
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 31

Expert Comment

by:Marco Gasi
ID: 41902487
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
ID: 41902488
Yes, I did remove the limit 1 as per my previous post but sadly it didn't work.
0
 
LVL 31

Expert Comment

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

Author Comment

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

Expert Comment

by:Marco Gasi
ID: 41902497
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 31

Expert Comment

by:Marco Gasi
ID: 41902504
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 31

Expert Comment

by:Marco Gasi
ID: 41902507
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 31

Expert Comment

by:Marco Gasi
ID: 41902508
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
ID: 41902558
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 31

Expert Comment

by:Marco Gasi
ID: 41902566
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
ID: 41902567
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
ID: 41902568
I get:

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

Expert Comment

by:Marco Gasi
ID: 41902570
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
ID: 41902572
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
ID: 41902573
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 31

Expert Comment

by:Marco Gasi
ID: 41902574
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 31

Expert Comment

by:Marco Gasi
ID: 41902577
Try to check locationId
0
 

Author Comment

by:Black Sulfur
ID: 41902578
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
ID: 41902579
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 31

Expert Comment

by:Marco Gasi
ID: 41902580
Really strange...
0
 
LVL 31

Expert Comment

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

Expert Comment

by:Marco Gasi
ID: 41902583
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
ID: 41902585
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
ID: 41902587
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 31

Expert Comment

by:Marco Gasi
ID: 41902588
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 31

Expert Comment

by:Marco Gasi
ID: 41902589
My comment was written before I read the yours
0
 

Author Comment

by:Black Sulfur
ID: 41902592
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
ID: 41902594
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 31

Expert Comment

by:Marco Gasi
ID: 41902597
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
ID: 41902601
Hmm. That doesn't seem to work. Also, I don't have a page called:

url: 'confirmDelete.php',
0
 
LVL 31

Expert Comment

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

Author Comment

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

Expert Comment

by:Marco Gasi
ID: 41902607
Ullalà, another problem here! Let me see
0
 

Author Comment

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

Expert Comment

by:Marco Gasi
ID: 41902615
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 31

Expert Comment

by:Marco Gasi
ID: 41902616
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

I imagine that there are some, like me, who require a way of getting currency exchange rates for implementation in web project from time to time, so I thought I would share a solution that I have developed for this purpose. It turns out that Yaho…
Part of the Global Positioning System A geocode (https://developers.google.com/maps/documentation/geocoding/) is the major subset of a GPS coordinate (http://en.wikipedia.org/wiki/Global_Positioning_System), the other parts being the altitude and t…
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…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

920 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

12 Experts available now in Live!

Get 1:1 Help Now