Two onclick on one element - javascript

I have a simple code to delete data from the database,and I want a warning message to appear before deleting. the code works fine when I put one onclick and when I put two only the first onclick works.
and I need to onclick one for the warning message and the other for delet.php page.
<form><input type="button" value="delete" onclick="return confirm('Really delete?');" onClick='window.location.href="delete.php?id= <?php echo $id; ?>"' ></form>

This is how I would handle it:
<input type="button" value="delete"
onclick="confirmDelete('<?php echo $id; ?>');">
Then elsewhere in the page:
<script type="text/javascript">
function confirmDelete(id) {
if(confirm('Really delete?')) {
window.location.href= "delete.php?id=" + id;
}
}
</script>
Notice I removed the <form> element. If this is the only context this is in, the <form> element is unnecessary since you're not actually filling out a form, just clicking a button. If there is more context you didn't include in your question, then it might be relevant to that.

Try using this with an if clause:
<form>
<input type="button" value="delete" onclick="
if(confirm('Really delete?')) {
window.location.href='delete.php?id=<?php echo $id; ?>';
}
else {
return false;
}
">
</form>

You can only use one onClick. But there's a way to do what you want in only one ;)
<form>
<input type="button" value="delete" onclick="
if(confirm('Really delete?')){
window.location.href=\"delete.php?id= <?php echo $id; ?>\"
}else{
return false;
}" />
</form>

Related

Comments system : open a complex form (editor) next to Reply button

I have written a comment system in PHP. Currently, the editor is on the top of the page:
<form method="POST" id="comment_form" enctype="multipart/form-data">
<input type="text" name="comment_name" id="comment_name" value="<?php echo $user ?>" placeholder="User" />
<textarea name="comment_content" id="comment_content" placeholder="Comment" rows="5"></textarea>
<input type="hidden" name="comment_id" id="comment_id" value="" />
<input type="submit" name="submit" id="save" class="btn" value="Send" />
</form>
Each comment look like that (simplified):
<div class="comment">
<b><?php echo $row["user"] ?></b>
<div>
<?php echo $row["comment"] ?>
</div>
<button type="button" class="btn reply" id="'.$row["comment_id"].'">Reply</button>
</div>
An small javascript function sets the focus on the editor when the Reply button is clicked:
$(document).on('click', '.reply', function(){
var comment_id = $(this).attr("id");
$('#comment_id').val(comment_id);
$('#comment_name').focus();
});
});
I would like that editor to open below any Reply button when one of the buttons is clicked.
I guess that adding the editor code after each comment with a "display: none" attribute is not the best solution.
Would you please help me to achieve that ?
If I understand correctly you want one form for all comments, rather than duplicating the form HTML inside every comment.
In which case you need to move it in the DOM via JavaScript. You don't show any attempt at this but it might look something like this:
$(document).on('click', '.reply', function() {
$('#comment_form').insertAfter(this); //<-- move form
var comment_id = $(this).attr("id");
$('#comment_id').val(comment_id);
$('#comment_name').focus();
});
Note also that your JS is syntactically invalid as you have double });.

How to make to submit button, delete and update at the same form,php

I am making a form that when user check one row with check button he can delete or update it...But only the delete button work.I dont know how to make two submit buttons in the same form. I want the delete button when pressed to go to delete.php and update button to go two update.php...Below is my form...
<form name="form1" method="post" action="delete.php">
<table >
<th>
<th ><strong>Emri </strong></th>
<th ><strong>Pershkrimi </strong></th>
<th><strong>Ora</strong></th>
</th>
<?php
while ($row=mysql_fetch_array($result)) {
?>
<tr>
<td ><input name="checkbox[]" type="checkbox" value="<?php echo $row['Id_Akt']; ?>"></td>
<td style="font-size:0.9em"><?php echo $row['Emri']; ?></td>
<td ><?php echo $row['Pershkrimi']; ?></td>
<td><?php echo $row['Ora']; ?></td>
</tr>
<?php
}
?>
</table>
<input class="button" name="delete" type="submit" value="Fshij" style="margin-left:4%; margin-top:50px; width:15%">
<br>
<input class="button" name="update" type="button" value="Update" style="margin-left:4%; margin-top:20px; width:15%" >
</form>
Please help me.Thanks in advance
you should change the values of your buttons like this
<button type="submit" name="send" value="delete"> delete </button>
<button type="submit" name="send" value="update">update</button>
and then at your "delete.php" page check which one of them you want to
if($_POST['send']=='update')
{ UPDATE table_name SET id='Your_ID' }
else
{DELETE FROM table_name WHERE id='Your_ID'}
I dont know how to port them to different pages directly without javascript, but you can check if the delete button is pressed with php like this
if(isset($_POST['delete']){
//Delete was triggered
}
else{
//Delete wasn't
}
with jquery you can also change the actual file. Like this
Jquery
$("input[type=submit]").click(function(e){
$(this).addClass("e-clicked");
});
$("form").submit(function(){
var vall = $(this).find(".e-clicked").attr("id");
if(vall == "DELETEID"){
$(this).attr("action", "deleteUrl.php");
}
else{
$(this).attr("action", "updateUrl.php");
}
});
Refer this :
Multiple submit buttons php different actions
Put this script in your page :
<script>
function submitForm(action)
{
document.getElementById('form1').action = action;
document.getElementById('form1').submit();
}
</script>
Modify your input code :
<input class="button" name="delete" type="submit" onclick="submitForm('delete.php')" value="Fshij" >
<input class="button" name="update" type="button" onclick="submitForm('update.php')" value="Update" >

why different effect in differnt browser after "onclick"

I want to enable the btn1 and disable btn2 on page-load. When I input value in txtbox1, then, on clicking btn1 ,btn1 should be disabled and enable btn2. If I click btn2, then btn2 should also be disabled.
$value= $_POST['tb1'.$id];
echo '<form name="f1" method="POST" action="">';
echo '<input type="text" id="txtbox1'.$id.'" name="tb1'.$id.'" value="'.$value.'" />';
echo '<input type="submit" id="btn1'.$id.'" name = "btnstart'.$id.'" value="START" onClick="document.getElementById(\'btn2'.$id.'\').disabled=false;this.disabled=true;"/><input type="submit" id="btn2'.$id.'" name = "btnend'.$id.'" value="End" onClick="this.disabled=true;" disabled/>';
echo '</form>';
if ( isset( $_POST['tb1'.$id] ) ) {
echo $value;
}
When I use Chrome, i can do the above button effects , but I cannot get the txtbox1 value.
When I use IE and Firefox, I can get the txtbox1 value, but the button effect is not want I want. Which means, I input value in txtbox1 then click btn1 only, then it will automatically enable btn2, then disable both then, then get back to the original status(btn1 enable, btn2 disable).
How to solve this problem?
Since you have dynamic button names, its better not to touch them for disbale/enable feature that you want :
Using jquery:
$(document).ready(function () {
/*Operations on the 1st button click */
$('#form').children("input[type='submit']:first").click(function () {
$(this).attr("disabled", "disabled"); /*disable the 1st button */
$('#form').children("input[type='submit']").eq(1).removeAttr("disabled"); /*enable the 2nd button */
});
/*Operations on the 2nd button click */
$('#form').children("input[type='submit']").eq(1).click(function () {
$(this).attr("disabled", "disabled");
});
});
Additionally : give your form an id, something like :
echo '<form name="f1" id="form" method="POST" action="">';
/* check the form id tag ^^ here*/
basic demo here
but you wont be able to see full feature in it!!
never write your code like this, this makes debugging like pain, just make a script tag and handle everything there like this, the point here is about setAttribute and removeAttribute:
<?php
// your server side code
// finish declaring your variables like
$input_id = 'an_id';
$input_value = 'some_value';
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>testing</title>
</head>
<body>
<form name="f1" method="POST">
<input type="text" id="txtbox1<?php echo $input_id; ?>" name="tb1<?php echo $input_id; ?>" value="<?php echo $input_value; ?>" />
<input type="button" id="btn1<?php echo $input_id; ?>" name="btnstart<?php echo $input_id; ?>" value="START" />
<input type="button" id="btn2<?php echo $input_id; ?>" name="btnend<?php echo $input_id; ?>" value="End" disabled="disabled"/>
</form>
<script type="text/javascript">
btn1 = document.getElementById('btn1<?php echo $input_id; ?>');
btn2 = document.getElementById('btn2<?php echo $input_id; ?>');
btn1.onclick = function() {
console.log(this);
btn1.setAttribute("disabled","disabled");
btn2.removeAttribute("disabled");
return false;
};
</script>
</body>
</html>

pressing submit button with javascript

actually I have:
<form action="<?php echo $this->getUrl('checkout/cart/estimatePost') ?>" method="post" id="shipping-zip-form" name="shipping-zip-form">
<label for="postcode"<?php if ($this->isZipCodeRequired()) echo ' class="required"' ?>><?php echo $this->__('Zip/Postal Code') ?></label>
<div class="input-box">
<input class="input-text validate-postcode<?php if ($this->isZipCodeRequired()):?> required-entry<?php endif;?>" type="text" id="postcode" name="estimate_postcode" value="<?php echo "04000"; ?>" />
</div>
<div class="buttons-set">
<button type="button" id="send" title="<?php echo $this->__('Get a Quote') ?>" onclick="coShippingMethodForm.submit()" class="button"><span><span><?php echo $this->__('Get a Quote') ?></span></span></button>
</div>
</form>
and I unsuccessful tried:
<script type="text/javascript">
document.getElementById('send').submit();
document.forms['shipping-zip-form'].submit();
</script>
What I want to do it's quite simple, let javascript automatically press the button so submit the form. I will not need the submit button anymore, I need to automate the press button process. Thx
I"m guessing that your function isn't firing. Set it to execute on page load if that's when you'd like it to happen. Also, only <form> elements can be submitted so trying to target your <button id="send"> won't work.
window.onload {
document.getElementById('shipping-zip-form').submit();
}
document.getElementById('shipping-zip-form').submit();
You can use jQuery and try this :
$(document).ready(function(){
$('#send').click(function(){
$('#shipping-zip-form').submit();
});
});

form with 2 buttons need to call different functions based on value

I have a page which has lot of post data in the url.
For example,
www.test.com/test.php?userid='tester'&name=test&so on
The above page has a form that has something like this:
<?
$set=get_value_set;
if($set ==1) {
$set_value="SET";
} else {
$set_value="UNSET";
}
?>
<form name="test">
<input type="text" readonly="READONLY" value="<? echo $user_id; ?>">
<input type="submit" value="Email" name="submit_user">
<input type="submit" value="<? echo $set_value; ?>" name="submit_user">
<?
function setuser()
{
//sets the value
}
function email_user()
{
//sets the value
}
?>
there are two buttons above, when I click on email, i want the value of email button to be passed to the email_user function and do some proceesing there. Similar thing when I click on the set button.
NOTE:But in both cases above, I want the form to remain in the same page with the same post data in the url, but I also want the page to be refreshed so that the set button can have a value of Set or Unset depending on the database update.
Is this possible?
I would start to remove the submit action of each button and change them to
<input type="button" class="btn-Email" value="Email" name="submit_user" />
<input type="button" class="btn-Other" value="<? echo $set_value; ?>" name="submit_user" />
and then, using jQuery, you can easily process each click and submit the form
$(function() {
$(".btn-Email").click(function() {
// append anything you want
var but_email_value = $(this).val(), // or $(".btn-Email").val()
btn_other_value = $(".btn-Other").val();
$("form").submit();
});
$(".btn-Other").click(function() {
// append anything you want
var but_other_value = $(this).val(), // or $(".btn-Other").val();
btn_email_value = $(".btn-Email").val();
$("form").submit();
});
});
change your HTML
<form id="test" name="test">
...
<button onclick="email_user();">Email</button>
<button onclick="setuser();"><? echo $set_value; ?></button>
</form>
your functions should submit the form for you:
document.getElementById("test").submit();

Categories

Resources