Pop up box Error - javascript

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

show/hide icons in div in table row using jquery

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();
}

Get content of an element contains a string and select it

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.

Jquery Find Active Class And Replace that class

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();
})

I need to Hide <tr> in a table when i click Addnew button(WORDPRESS,PHP)

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>

Return confirm window in JavaScript

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/

Categories

Resources