In a php file, I have the following code:
echo '<form action="../apps" method="post" enctype="multipart/form-data"">';
echo '<input type="hidden" name="check" />';
echo '<input type="hidden" name="ID" value="'.$ID.'" />';
echo '<input type="submit" value="Delete" onclick="confirmDelete()" "style="margin-right: 5px;" />';
echo '</form>';
The function:
function confirmDelete()
{
var agree= confirm("are you sure?");
if (agree == true)
{
return ('<?php
if (isset($_POST['check']))
{
if ($queryType == "apps")
{
$deletePath = "delete/";
include $deletePath.'deleteApp.php';
}
}
?>');
return true;
}
else
{
alert("you pressed cancel");
return false;}
}
The alert box shows up when cancel is pressed, but instead of canceling the action, it deletes it anyway. I am new to javascript and am not sure what is wrong.
Pressing the OK button deletes everything correctly, but the calcel button immediately deletes the app as well.
You need to return the result in the onclick attribute.
echo '<input type="submit" value="Delete" onclick="return confirmDelete()" "style="margin-right: 5px;" />';
ps: you don't have to echo huge strings of HTML. You could easily replace all of those echo calls with this
<form action="../apps" method="post" enctype="multipart/form-data"">
<input type="hidden" name="check" />
<input type="hidden" name="ID" value="<?php echo $ID ?>" />
<input type="submit" value="Delete" onclick="return confirmDelete()" />
</form>
Related
I created a cancel button using the method explained by macino in this thread
cancel button using php
But I have to use history.back(); twice to cancel the form. What is the reason for that? Thanks.
$post_counter=1;
foreach ($comment as $c) {
echo $c['comment'] . "<br>";
echo "By " . $c['first_name'] . "<br>";
if($c['uid'] == $current_user) { ?>
Edit<br>
<div id="<?php echo "post_edit_box" . $post_counter; ?>" style="display:none">
<form id="<?php echo "reply_form" . $post_counter; ?>" method="post" action="<?php echo site_url('Forum/update_comment'); ?>">
<input type="text" name="edit_comment" value="<?php echo $c['comment'];?>" class="form-control">
<input type='hidden' name='edit_cid' value='<?php echo $c['id']; ?>'/>
<button type="submit">Save Changes</button>
<input type="button" value="Cancel" onclick="history.back();history.back();" />
</form>
</div>
<script>
function show_postedit_box(clicked_edit_id){
let str_edit = clicked_edit_id;
str_edit.replace("post_edit_link", "");
//console.log('mylink' + str.replace("mylink", ""));
document.getElementById('post_edit_box' + str_edit.replace("post_edit_link", "")).style.display = "block";
document.getElementById('post_edit_link' + str_edit.replace("post_edit_link", "")).style.display = "none";
}
</script>
<?php
$post_counter++;
}
I am trying to submit a form using ajax with jquery mobile without it refreshing the page and am having no luck..
I have this form -
index.php:
<script>
function SubmitForm() {
var name = $("#name").val();
$.post("bump.php", { name: name},
function(data) {
//alert(data);
});
}
</script>
<form method="post" data-ajax="false">
<input name="name" type="hidden" id="name" type="text" value="<?php echo $id; ?>" />
<input type="image" style="height:35px;top:4px;" id="bump" src="../img/bump.png" id="searchForm" onclick="SubmitForm();" value="Send" />
</form>
Here is bump.php
$date = date('y/m/d H:i:s');
$id = $_POST['name'];
$sql = "UPDATE images SET update_date='$date' WHERE id=$id";
if ($conn->query($sql) === TRUE) {
} else {
echo "Error updating record: " . $conn->error;
}
I would like to maintain my position on the page but it refreshes each time? What am I doing wrong here?
Use event.preventDefault(); Cancels the event if it is cancelable, without stopping further propagation of the event.
Default behaviour of type="image" is to submit the form hence page is unloaded
function SubmitForm(event) {
event.preventDefault();
var name = $("#name").val();
$.post("bump.php", {
name: name
},
function(data) {
//alert(data);
});
}
<form method="post" data-ajax="false">
<input name="name" type="hidden" id="name" type="text" value="<?php echo $id; ?>" />
<input type="image" style="height:35px;top:4px;" id="bump" src="../img/bump.png" id="searchForm" onclick="SubmitForm(event);" value="Send" />
</form>
user return false in onclick`
function SubmitForm() {
//event.preventDefault();
var name = $("#name").val();
console.log(name);
$.post("message.html", { name: name},
function(data) {
alert(data);
});
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<form method="post" data-ajax="false">
<input name="name" type="hidden" id="name" type="text" value="<?php echo $id; ?>" />
<input type="image" style="height:35px;top:4px;" id="bump" src="http://switchon.global2.vic.edu.au/files/2015/07/4x5-1jroh2i.png" id="searchForm" onclick="SubmitForm(); return false;" value="Send" />
</form>
Here's a div which represents cart item qty field:
<div class="cart_quantity_div">
<form action="cart.php" method="post">
<button class="cart_qty_controls" onclick="minusOne(qty_field_<?php echo $item_id; ?>)">-</button>
<input type="text" name="cart_item_qty" value="<?php echo $each_item['quantity']; ?>" size="1" maxlength="3" id="qty_field_<?php echo $item_id; ?>"/>
<input type="submit" name="qty_adjust_cart<?php echo $item_id; ?>" value="change" class="cart_qty_adjust_btn"/>
<input type="hidden" name="cart_item_to_adjust_qty" value="<?php echo $item_id; ?>"/>
</form>
</div>
It is a draft version so don't pay attention to submit and hidden inputs
And JS code:
function minusOne (input_id){
var subtracted_qty = document.getElementById(qty_field_id).value = document.getElementById(qty_field_id).value - 1;
document.getElementById(qty_field_id).value = subtracted_qty;
}
I want to change value of input text field by clicking minus button by -1. But for some reason it's not working.
Can you, please, review my code and find whats wrong with it. Or maybe there is some better ways to do such qty change..
Your code does not set the variable qty_field_id, nor does it use the variable input_id. If input_id is referring to the same value as PHP’s $item_id, then try adding the following line to the top of the JavaScript function:
var qty_field_id = "qty_field_" + input_id;
You shouldn't use inline javascript and you aren't referencing the correct element. Try this instead:
HTML:
<div class="cart_quantity_div">
<form action="cart.php" method="post">
<button class="cart_qty_controls" data-productId="<?php echo $item_id; ?>">-</button>
<input type="text" name="cart_item_qty" value="<?php echo $each_item['quantity']; ?>" size="1" maxlength="3" id="qty_field_<?php echo $item_id; ?>"/>
<input type="submit" name="qty_adjust_cart<?php echo $item_id; ?>" value="change" class="cart_qty_adjust_btn"/>
<input type="hidden" name="cart_item_to_adjust_qty" value="<?php echo $item_id; ?>"/>
</form>
</div>
JS:
[].slice.call(document.getElementsByClassName('cart_qty_controls')).forEach(function(el){
el.addEventListener('click', function(e) {
var id = e.target.getAttribute('data-productId');
document.getElementById('qty_field_' + id).value -= 1;
})
})
Trying to first populate fields with one js button and then submit that collect data with a second js button
I can get the fields to poulate, when I click the "Populate" button, but when I try to do the submit none of the values show on the ordertest.php
Thanks
<form action="#" name="data" id="data">
<input type='button' value='Populate' onclick='popContact()' /><BR>
<input type="submit" onclick="document.getElementById('data').action = 'ordertest.php'" value="Payment Submit" /><BR>
Contact Info:<BR>
First Name: <input type='text' readonly="readonly" name='cfname' /><BR>
Last Name: <input type='text' readonly="readonly" name='clname' /><BR>
Email:<input type='text' readonly="readonly" name='cemail' /><BR>
</form>
<script type="text/javascript">
function popContact()
{
var c = window.external.Contact;
data.cfname.value = c.FirstName;
data.clname.value = c.LastName;
data.cemail.value = c.EmailAddr;
}
</script>
---> ordertest.php
<?php
$current_firstname = $_POST["cfname"];
$current_lastname = $_POST["clname"];
$current_email_address = $_POST["cemail"];
echo "current_firstname ".$current_firstname;
echo "<br>";
echo "current_lastname ".$current_lastname;
echo "<br>";
echo "current_email_address ".$current_email_address;
?>
also tried
<input type="submit" onclick="this.form.action='ordertest.php'" value="Payment Submit" />
Oppps.
using this combination works, $_GET
<input type="submit" onclick="this.form.action='order.php'" method="POST" value="Payment Submit" />
---> ordertest.php
<?php
$current_firstname = $_GET["cfname"];
$current_lastname = $_GET["clname"];
$current_email_address = $_GET["cemail"];
echo "current_firstname ".$current_firstname;
echo "<br>";
echo "current_lastname ".$current_lastname;
echo "<br>";
echo "current_email_address ".$current_email_address;
?>
I need to process my form using jQuery (without refresh my site ) and using one buddon i want to add or delete row from my database .
Inserting to database works fine
Deleteting too but i dont know what i need to do that after first click i add to database but after second click i delete row from database.
My FORM
<form action="index.php" method="post" id="myForm">
<input type="hidden" name="option" value="com_mediamall" />
<input type="hidden" name="task" value="addToFav" />
<input type="hidden" name="addMediaId" value="<?php echo $media->id; ?>" />
<input type="hidden" name="delRow" value="<?php echo $del->id; ?>" />
<input type="submit" name="submit" id="sub" value="1"></input>
</form>
jQUERY
<script>
$("#sub").click( function() {
$.post( $("#myForm").attr("action"), $("#myForm :input").serializeArray());
});
$("#myForm").submit( function() {
return false ;
});
</script>
FUNCTION INSERT OR DELETE
function addToFav() {
$user =& JFactory::getUser();
$db2 =& JFactory::getDBO();
$mediaid = $_POST['addMediaId'];
$delid = $_POST['delRow'];
if(isset($_POST['submit']) == '1') {
$query = ' INSERT INTO `#__mediamall_favourite_media` (`id`, `userid`, `mediaid`) VALUES ("","'.$user->id.'","'.$mediaid.'")';
}
elseif(isset($_POST['submit']) == '0') {
$query = ' DELETE FROM #__mediamall_favourite_media WHERE id = "'.$delid.'" ';
$db2->setQuery($query);
$db2->query();
}
}
Will be apriciate form your help because i spend a lot of hours to find the anwer and without the result .. Thanks
you need to use preventDefault
$('#myForm').submit(function(e){
e.preventDefault();
var url = $("#myForm").attr("action");
$.post(url,{data : $('#myForm').serialize()},function(data){
//process
});
});
and you can also use json to retrieve data from php so in your php file you can do
$data['res'] = 'ok';
$data['something_else'] = 'value';
echo json_encode($data);
Then process it like this
$('#myForm').submit(function(e){
e.preventDefault();
var url = $("#myForm").attr("action");
$.post(url,{data : $('#myForm').serialize()},function(data){
//process
console.log(data.res);
console.log(data.something_else);
}.'json');
});
Toggle submit button value after insert or delete like,
$("#sub").click( function() {
var url=$("#myForm").attr("action");
$.post(url, $("#myForm :input").serializeArray(),function(){
var val=$("#sub").val()==1 ? 0 : 1;// toggle value of submit for insert or delete
$("#sub").val(val);
});
});
In PHP change your condition from isset($_POST['submit'])=='1' to isset($_POST['submit']) and $_POST['submit'] == '1'
Code like,
if(isset($_POST['submit']) and $_POST['submit'] == '1') {
$query = ' INSERT INTO `#__mediamall_favourite_media` (`id`, `userid`, `mediaid`) VALUES ("","'.$user->id.'","'.$mediaid.'")';
}
elseif(isset($_POST['submit']) and $_POST['submit'] == '0') {
$query = ' DELETE FROM #__mediamall_favourite_media WHERE id = "'.$delid.'" ';
}
if($query)
{
$db2->setQuery($query); //after if - else conditions
$db2->query();
}
HTML
<form action="" onsubmit="return false;" method="post" id="myForm">
<input type="hidden" name="option" value="com_mediamall" />
<input type="hidden" name="task" value="addToFav" />
<input type="hidden" name="addMediaId" value="<?php echo $media->id; ?>" />
<input type="hidden" name="delRow" value="<?php echo $del->id; ?>" />
<input type="submit" name="submit" id="sub" value="1"></input>
JQUERY
$('#myForm').submit(function(){
$.post(url,$('#myForm').serialize(),function(success){
if(success=='success'){
alert('Data Sent);
// or do something else
}
});
});