I want an alert to display to make sure the user will double confirm if they want to delete the data.
<a onclick="return confirm('Are you sure?')" href="del.php?masId=<?php echo $row['masId'] ?>" >delete</a>
My php code:
$masId = $_GET['masId'];
$res=$MySQLiconn->query("Delete FROM masinflation WHERE masId=".$masId);
However, the data still will be removed even I click cancel.
You can use below code which will prevent default behavior of anchor tag if you click on cancel button.
<a class="confirmation" href="del.php?masId=<?php echo $row['masId'] ?>" >delete</a>
<script type="text/javascript">
var elems = document.getElementsByClassName('confirmation');
var confirmIt = function (e) {
if (!confirm('Are you sure?')) e.preventDefault();
};
for (var i = 0, l = elems.length; i < l; i++) {
elems[i].addEventListener('click', confirmIt, false);
}
</script>
<a class="btn btn-large btn-danger" onclick="return checkDelete()" href="del.php?masId=<?php echo $row['masId'] ?>" >delete</a>
<script language="JavaScript" type="text/javascript">
function checkDelete(){
return confirm('Are you sure?');
}
</script>
Related
I need to change the class of a span child that uses a toggle when I click on one of the browser rows.
But it only works when there is a single row, when there are several rows it does not find the span and it does not work.
I also tried to use the href to select the correct span, but I don't know how to use it in the JQuery code
<div>
<a id="menu-toggle" data-toggle="collapse" data-parent="#accordion" href="#01" class='btn btn-default' title='Ver pagos'>
<span class="glyphicon glyphicon-chevron-down"></span>
</a>
</div>
<div>
<a id="menu-toggle" data-toggle="collapse" data-parent="#accordion" href="#02" class='btn btn-default' title='Ver pagos'>
<span class="glyphicon glyphicon-chevron-down"></span>
</a>
</div>
jQuery(function($) {
$('#menu-toggle').on('click', function() {
var $el = $(this),
textNode = this.lastChild;
var $href = $(this).attr('href');
var $href = $href.substring(1);
$el.find('span').toggleClass('glyphicon-chevron-down glyphicon-chevron-up');
});
});```
Try this
var el = 2
for(var i=0; i<el.length; i++) {
document.getElementsByClassName("glyphicon").find('span').toggleClass('glyphicon-
chevron-down glyphicon-chevron-up');
}
Finally I simplified the code so I commented the span and then call with the function onclick CambiaClass, using a class data1, data 2 ... dataN (to identify the item) and now is working fine.
Thanks for your help Rahul!!!
<a id="menu-toggle" data-toggle="collapse" data-parent="#accordion" href="#<?php echo $id_item; ?>"
class='btn btn-default glyphicon glyphicon-chevron-down <?php echo 'dato'.$id_item; ?>'
title='Ver pagos' onclick="CambiaClass('<?php echo 'dato'.$id_item; ?>')">
<!-- span class="glyphicon glyphicon-chevron-down"></span -->
</a>
//Jquery
<script type="text/javascript">
function CambiaClass(idclass) {
$("[class*='"+ idclass+"']").toggleClass('glyphicon glyphicon-chevron-down').toggleClass('glyphicon glyphicon-chevron-up');
}
</script>
I have a list of items on my page from a DB table
I am trying to change the glyphicon when checked
<div class="div1">
<span id=".<?php echo $row['id']; ?>" style="color:black;" class="glyphicon glyphicon-eye-open"> </span>
</div>
this is the script on the top of my page:
<script>
$(document).ready(function(){
$(".div1").click(function(){
$(".div1").load("clicked.php");
});
});
</script>
clicked.php looks like:
<span id="<?php echo $row['id']; ?>" style="color:black;" class="glyphicon glyphicon-ok"> </span>
The problom is the when I click on one item - all the items change there glyphicons
What am I doing wrong?
You just have to remove & add new class:
$(document).ready(function(){
$(".div1").click(function(){
$(this).children('span').removeClass('glyphicon-eye-open');
$(this).children('span').addClass('glyphicon-ok');
//Here you can add ajax call
});
});
There is no need to go all the way to the server to get a new span when all you are doing is removing a class and adding a new class to a span.
Also using the right scope, $(this) will stop it effecting all your div1 elements.
<script>
$(document).ready(function(){
$(".div1").click(function(){
//$(".div1").load("clicked.php");
$(this).children('span').removeClass('glyphicon-eye-open');
$(this).children('span').addClass('glyphicon-ok');
});
});
</script>
And to make the code toggle from one to another on each click
<script>
$(document).ready(function(){
$(".div1").click(function(){
if ( $(this).children('span').hasClass('glyphicon-ok') ) {
$(this).children('span').removeClass('glyphicon-ok');
$(this).children('span').addClass('glyphicon-eye-open');
} else {
$(this).children('span').removeClass('glyphicon-eye-open');
$(this).children('span').addClass('glyphicon-ok');
}
});
});
</script>
I have problem when I click button edit, I hope I can redirect to
http://localhost/activity/edit_activity/172
where 172 is activity_id but actually i redirect activity_detail so here my code
My HTML
<a href='<?php echo site_url();?>activity/delete_activity_edit/<?php echo $row->activity_detail_id;?>' onclick='return confirm()' class="btn btn-sm btn-danger">
<i class="glyphicon glyphicon-trash"></i>Delete</a>
My Controller
public function delete_activity_edit()
{
$id=$this->uri->segment(3);
$this->activity->remove($id);
redirect('activity/edit_activity/'.$id);
}
My Model
public function remove($id)
{
$where_array = array(
'activity_detail_id'=>$id);
$this->db->where($where_array);
$this->db->delete('t_trx_activity_detail');
}
Where is my wrong code. And how to resolve it?
You can use below code format:
<i class="glyphicon glyphicon-trash"></i>Delete
Add this javascript function:
<script type="text/javascript">
var url="<?php echo base_url();?>";
function confirm_delete(id){
var r=confirm("Do you want to delete this?")
if (r==true)
window.location = url+"activity/delete_activity_edit/"+id;
else
return false;
}
</script>
Now your controller redirection works.
I have this code inside a while loop for fetching data from the database. I want to show a confirmation popup when the Delete link is clicked.
echo "<td><a href='delete.php?id=" . $row['serial_no'] . "'>Delete</a></td>";
How can this be done?
Try out confirm function from JavaScript, learn jQuery as fast as possible and try to seperate javascript from html ;).
http://www.w3schools.com/jsref/met_win_confirm.asp
<td>
<a href="delete.php?id=<?php echo $row['serial_no'] ?>" id="a_id">
Delete
</a>
</td>
<script type="text/javascript">
$(function() {
$('td a#a_id').click(function() {
return confirm("Are You sure that You want to delete this?");
});
});
</script>
add onClick attribute for anchor link and call the function on it. Or simply show confirm.
<a onClick = "confirm ('Are You Sure?')"
Complete Example
function disp_confirm()
{
var r=confirm("Press a button!")
if (r==true)
{
alert("You pressed OK!")
}
else
{
alert("You pressed Cancel!")
}
}
<a onclick="disp_confirm()"
try this
function DeleteClick(serial_no)
{
if(confirm('Are you sure to delete ' + serial_no + '?'))
{
alert('Data deleted');
return true;
}
return false;
}
echo "<td><a href='delete.php?id=" . $row['serial_no'] . "' onclick="return
DeleteClick(\''. $row['serial_no'].'\')">Delete</a></td>";
echo "<td>Delete</td>";
try this code,hope it will work-
<td>
<a href="#" onclick="conf("delete.php?id=".<?php echo $row['serial_no']; ?>.")">
Delete
</a>
</td>
<script type="text/javascript">
function conf(str) {
if(confirm("Your Message") == true){ location.replace(str);}
}
</script>
and in the delete.php page-just grab the id from url and run the delete query.
I have this link:
<a id='delete' href='/add/delete.php?iid=XXXXX'>#</a>
And I want to pass it on through Jquery so the page doesn't refresh. However, I'm having a difficult time making that happen. All of the click events and ajax I've tried with Jquery have been unsuccessful.
Basically, I want the ajax to send delete.php the value in the iid parameter.
Here try this the href='1' is the id you want to delete, also to replace the text it finds the id="d1":
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$(".delete").click(function(e){
var del_id = $(this).attr('href');
e.preventDefault();
$.post("/add/delete.php", { iid: del_id } ,function(data){
//change the link to deleted
$('#d'+del_id).replaceWith('Deleted');
});
});
});
</script>
</head>
<body>
<a class='delete' id="d1" href='1'>Delete</a>
<a class='delete' id="d2" href='2'>Delete</a>
<a class='delete' id="d3" href='3'>Delete</a>
<a class='delete' id="d4" href='4'>Delete</a>
</body>
</html>
$(function(){
$("#delete").click(function(e){
e.preventDefault();
$.post("../add/delete.php", { iid: "xxx" } ,function(data){
//do whatever with the result which is in the variable data.
alert(data)
});
});
});
Since it is a delete, use POST. Otherwise some crawlers will crawl your delete page and you will see your tables are empty one fine morning.
EDIT : You can associate the value to be passed with the anchor tag in someway. Ex :Change your id tag to be in this format del-YouIdTobe deleted ( Ex : del-1,del-2 etc..)
<a id='delete' href='#' id="del-1>Delte 1 </a>
<a id='delete' href='#' id="del-2>Delte 2 </a>
<a id='delete' href='#' id="del-3>Delte 3 </a>
Script
$(function(){
$("#delete").click(function(e){
e.preventDefault();
var val=$(this).attr("id").split("-")[0];
$.post("../add/delete.php", { iid: val } ,function(data){
//do whatever with the result which is in the variable data.
alert(data)
});
});
});