When I click cancel on the pop up message it still deletes the record and I don't know why.
<tr>
<td class="recordCells">
<div align="center">
<a onclick="confirm('Are you sure you want to delete this record?')" href="deleterecord.php?ID=<?php echo $row_rsInventory['ID']; ?>">
<img src="../images/x.png" align="absmiddle">
</a>
</div>
</td>
</tr>
You doesn't return the value of the confirm box :
<tr>
<td class="recordCells">
<div align="center">
<a onclick="return(confirm('Are you sure you want to delete this record?'))" href="deleterecord.php?ID=<?php echo $row_rsInventory['ID']; ?>">
<img src="../images/x.png" align="absmiddle">
</a>
</div>
</td>
</tr>
Actually there is a problem of "href = deleterecord.php file" in anchor tag so you can use code something like that:
jQuery(".confirm_click").click(function(){
var check = confirm("Are you sure you want to delete this record?");
if(check == true){
// Action - Record deleted
var url= jQuery(this).attr("url");
jQuery(location).attr('href',url);
}else{
// Action - none
}
});
Html code:-
<a class="confirm_click" href="" url="deleterecord.php?ID=<?php echo $row_rsInventory['ID']; ?>">
<img src="../images/x.png" align="absmiddle">
</a>
or you can send me a part of code on "mohit.tiwari#techinfini.com" and i'll make it in proper way.
Related
I have a table, its is data displayed using foreach. one column have 3 icons, by default they are hidden. And also have checkbox. icons and checkbox are in every row. Now when select any checkbox, icons of all rows are appearing. Instead I want only one row icons should be displayed on selecting checkbox. Can somebody help please. thanks in advance. here is the code.
in view
<?php $sn= $this->uri->segment(4); foreach($companies as $company){ $sn++;?>
<tr class="parent" style="font-size:11px;color:#3D4061;border-bottom:1px solid #3d406136">
<td><input type="checkbox" class="text-center check_data mt-2" onchange="changevalue()"></td>
<td class="text-center" style=""><h6><?php echo $sn; ?></h6></td>
<td class="text-center" style=""><h6><?php echo $company->company_name; ?></h6></td>
<td class="text-center" style=""><h6><?php echo $company->contact_no; ?></h6></td>
<?php if($company->activation_status == 1){?>
<td class="text-center" style=""><h6 class="text-success font-weight-bold" style="font-size:13px">Active</h6></td>
<?php } ?>
<?php if($company->activation_status == 0){?>
<td class="text-center" style=""><h6 class="text-danger font-weight-bold" style="font-size:13px">Inactive</h6></td>
<?php } ?>
<td class="text-center" style="">
<div class="status">
<i class="fa fa-edit"></i>
<?php if($company->activation_status == 0){?>
<i class="fa fa-dot-circle-o"></i>
<?php }else{ ?>
<i class="fa fa-exclamation-triangle"></i>
<?php } ?>
<i class="fa fa-trash-alt"></i>
</div>
</td>
<td ><i class="fa fa-chevron-down down" ></i></td>
</tr>
and script is
<script>
$('.status').hide();
function changevalue(){
if($(".check_data").is(":checked"))
$('.status').show();
else
$(".status").hide();
$('.cchild').hide();
}
</script>
you can also use .parent() and .find() methods to get specific row like that:
<input type="checkbox" function="changevalue(this)">
and your javacript must be like that:
function changevalue(elem){
if($(elem).is(":checked"))
$(elem).parent().parent().find('.status').show();
else
$(elem).parent().parent().find('.status').hide();
}
This code can be simplified but it's a good starting example to understand parent-child usage of html elements. At this example first .parent() goes to <td> of checkbox element and second .parent() goes to <tr> element then it searches for .status class in it then hides it.
and you can simplfy it like that:
function changevalue(elem){
if($(elem).is(":checked"))
$(elem).parents("tr").find('.status').show();
else
$(elem).parents("tr").find('.status').hide();
}
function changevalue() {
var $this = $(this),
$status = $this.parents("tr").find(".status");
if ($this.is(":checked")) {
$status.show();
} else {
$status.hide();
}
}
You can give dynamic Ids to every checkbox and status div. Use your record's id may be companyId to create Ids like
<input type="checkbox" id="checkbox_('<?php echo $company->id; ?>')>
I don't know the syntax for php.
and then you can pass the current companyId in onchange="changevalue(companyId)"
and then your code will be like this
function changevalue(companyId){
if($("#checkbox" + companyId).is(":checked"))
$('#status' + companyId).show();
else
$("#status" + companyId).hide();
}
I'm looking for a way to search for a string in a table rows by jquery and get all of that contents and select the element that have it to get the other pieces!
here is the html side:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Tel</th>
<th>Description</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
$allcontacts=$contact->getallcontacts("name",$_SESSION['username']);
if($allcontacts!=null)
foreach($allcontacts as $value){
?>
<tr>
<td class="contact-id">
<?php echo $value[0]; ?>
</td>
<td class="contact-name">
<?php echo $value[1]; ?>
</td>
<td class="contact-tell">
<?php echo $value[2]; ?>
</td>
<td class="contact-info">
<?php echo $value[3]; ?>
</td>
<td class="td-actions">
<a href="?IDD=<?php echo $value[0]." &owner=".$_SESSION['username'];?>">
<i class="glyphicon glyphicon-trash"></i>
</a>
<a href="#" class="eb" data-uid="<?php echo $value[0]; ?>" data-toggle="modal" data-target=".bs-example-modal-lg">
<i class="glyphicon glyphicon-edit"></i>
</a>
<a href="#" onclick="" class="se">
<i class="glyphicon glyphicon-envelope"></i>
</a>
</td>
</tr>
<?php } ?>
</tbody>
</table>
<input type="text" class="cs" /><input type="button" value="Search" class="csb"/>
here is the script side!
$(".csb").click(
function() {
var ss = $(".cs").val();
var farray = $("td:contains(ss)").toArray();
console.log(farray);
}
);
console gets me an empty array!
ok ive tried ur code, obiously without php, so i put plain info. maybe this will help u
$(".csb").click(function(){
var ss = $(".cs").val();
var farray = new Array(); //define array
$("tr").removeAttr("style"); //reset all
if(ss!=""){ //check if isnt empty
$("td:contains("+ss+")").each(function(){
$(this).parent().css("background","red"); //select found
//push to array
farray.push($(this).parent().find(".contact-id").html());
farray.push($(this).parent().find(".contact-name").html());
farray.push($(this).parent().find(".contact-tell").html());
farray.push($(this).parent().find(".contact-info").html());
});
}
else{
alert("put a text");
}
//result
$("code").html("value search: "+ss);
$("pre").html("id found: "+farray[0]+"<br>"+
"name found: "+farray[1]+"<br>"+
"tel found: "+farray[2]+"<br>"+
"info found: "+farray[3]);
});
this is the full code: https://jsfiddle.net/keejke5e/3/
You don't need to add .toArray() as $("td:contains(ss)") returns array. I think you need to check whether you getting $("td") element or not. As for I see, according to your code it should find it. So just check $("td") and $("td:contains(ss)") in your chrome console.
From the above image currently 1st View Details is clicked so it is showing as Hide Details.
if i click on 3 rd View Details all 1st one or(Active one) has to be relaced to view details how can i do that..?
Here what i have tried:
Hide Details:
$("#tbodyid" ).on( "click", ".hide-details", function() {
$("#participantsForGd").hide();
var field = $(this);
field.text("View Details");
field.addClass("view-details");
field.removeClass("hide-details");
});
View-datails
$("#tbodyid" ).on( "click", ".view-details", function() {
$("#participantsForGd").show();
var field = $(this);
field.text("Hide Details");
field.addClass("hide-details");
field.removeClass("view-details");
});
My html:
<?php while($grpData = $grpQuery->fetch_assoc()){ ?>
<tr>
<td>
<span id="<?php echo $grpData['group_id'];?>" class="view-details">View Details</span>
</td>
</tr>
<?php } ?>
This one has to work like toggle:
<form id="participantsForGd" >BLAH BLAH </form>
Your html structure is not good to do this task easily. I am showing how you perform this task. Then you can modify as your need.
HTML:
<button class='details-btn hide-details'>Hide Details</button>
<button class='details-btn view-details'>View Details</button>
<button class='details-btn view-details'>View Details</button>
<button class='details-btn view-details'>View Details</button>
JQuery:
$('.details-btn').click(function(){
$('.details-btn').each(function(){
$(this).removeClass('hide-details').addClass('view-details').text('View Details');
});
$(this).removeClass('view-details').addClass('hide-details').text('Hide Details');
})
I think your php code will generate dom structure as below:
<table>
<tbody id="tbodyid">
<tr>
<td id="group-id-1" class="details view-details">View Details</td>
<td id="group-id-2" class="details view-details">View Details</td>
<td id="group-id-3" class="details view-details">View Details</td>
<td id="group-id-4" class="details view-details">View Details</td>
</tr>
</tbody>
</table>
And you have four divs which contains details for each button.
<div id="participantsForGd-1" class="participantsForGd"></div>
<div id="participantsForGd-2" class="participantsForGd"></div>
<div id="participantsForGd-3" class="participantsForGd"></div>
<div id="participantsForGd-4" class="participantsForGd"></div>
My solution is :
$('#tbodyid').on('click', '.details', function(){
$('.details').each(function(){
$(this).removeClass('hide-details').addClass('view-details').text('View Details');
});
$('.participantsForGd').each(function(){
$(this).hide();
});
$(this).removeClass('view-details').addClass('hide-details').text('Hide Details');
$('#participantsForGd-' + $(this).attr('id').split('-')[2]).show();
})
Add new button
<div class="icon32 icon32-posts-post" id="icon-edit"><br></div>
<h2><?php _e('Collaboration', 'custom_table_example')?> <a class="add-new-h2" id=" add_new"
href="<?php echo get_admin_url(get_current_blog_id(), 'admin.php?page=persons_form');?>"><?php _e('Add new','custom_table_example')?> </a>
</h2>
(Need to hide)
-----------------------------------------
<tr class="form-field" id="appid">
<th valign="top" scope="row">
<label for="Application_ID"><?php _e('Application ID', 'custom_table_example')?></label>
</th>
<td>
</tr>
</tbody>
</table>
How to hide when AddNew Button is clicked??
I cannot directly give hide or display:none because "Edit and Add new" uses the same form.so on-click of Add new i need to hide tablerow
Also i had tried giving on-click function(Javascript) "document.getElementById("appid").style.display = 'none';"
still i didn't get any response.
Can any one of you help me please!!! Thanks in advance
Refer to this link wordpress-custom-database-table-example-full
Try to add the below javascript code
<script type="text/javascript">
document.getElementById("add_new").addEventListener("click", function(event){
document.getElementById("appid").style.display = 'none';
event.preventDefault()
});
</script>
I'm working with an if else statement which will only display depending on the statement. My confirm window is not working. It will just go to the log-out page without the confirmation.
My code:
else
{
echo "
<td class='td1' align='center'>
<a href='logout.php' onclick='return confirm('Are you sure you want to Log Out?')'><img src='./buttons/logout1.png' width='50' height='35' alt='Log Out'></a>
</td>
</tr>
</table>
";}
<table><tr>
<td class='td1' align='center'>
Log Out
</td>
</tr>
</table>
Change your code to this
else
{
echo "
<td class='td1' align='center'>
<img src='./buttons/logout1.png' width='50' height='35' alt='Log Out'>
</td>
</tr>
</table>
";}
Use escape sequence inside onlclick.
Just simply replace your code with this because you have placed a return before confirm, but by JavaScript there is the confirm keyword which will give you functionality what you are expecting instead of return confirm. Just confirm will work.
else
{
echo "
<td class='td1' align='center'>
<a href='logout.php' onclick='confirm('Are you sure you want to Log Out?')'><img src='./buttons/logout1.png' width='50' height='35' alt='Log Out'></a>
</td>
</tr>
</table>
";}
You either use
<img ...>
Note the return (confirm): The value returned by scripts in intrinsic events decides whether the default browser action is run or not; in case you need to run a big piece of code you can of course call another function:
<script type="text/javascript">
function confirm_delete() {
return confirm('Are you sure?');
}
</script>
...
<img ...>
Or else you can simply try this:
onclick="javascript:return confirm('Are you sure you want to logout?')"
Use double "" instead of ''. Then it's OK. Change to onclick="confirm('Are you sure you want to Log Out?')"
<img src='./buttons/logout1.png' width='50' height='35' alt='Log Out'>
Be careful with your single quotes. Replace ยด by " in confirm:
Here is an example: jsfiddle.net/37z6wpmz/