how to reveal coupon code using php - javascript

i Want to reveal coupon code on button click
<script type='text/javascript' >
jQuery('#id1').click(function(){
jQuery(this).replaceWith("<?php echo $_coupon?>");
})
</script>
<?php if ($_coupon != '' ):?>
<button id="id1" type="button" class="but" value="Button Name"> </button>
<?php endif; ?>
This is my code it works only with first button click that means show only one value not works as a loop please help me to solve my problem

I would do it this way:
<script type='text/javascript' >
jQuery('#id1').click(function(){
jQuery(this).replaceWith(jQuery(this).val());
})
</script>
<?php if ($_coupon != '' ):?>
<button id="id1" type="button" class="but" value="<?php echo $_coupon ?>"></button>
<?php endif; ?>

I would add a hidden input like this:
<?php if ($_coupon != '' ):?>
<input type="hidden" id="coupon" value="<?php echo $_coupon ?>" />
<button id="id1" type="button" class="but" value="Button Name"></button>
<?php endif; ?>
Then in the jquery get the value from the object:
<script type='text/javascript' >
jQuery('#id1').click(function(){
jQuery(this).replaceWith($('#coupon').val());
})
</script>

<script type='text/javascript' >
jQuery('#id1').click(function(){
jQuery(this).replaceWith("<?php echo $_coupon; ?>");
});
</script>
<?php if ($_coupon != '' ):?>
<button id="id1" class="but" value="Button Name"></button>
<?php endif; ?>
It's working correctly.
Check the id of the button is already defined in various place of this page. because the id must be unique.
Also try this one,
<script type='text/javascript' >
$(document).ready(function(){
$('#id1').click(function(){
$(this).replaceWith("<?php echo $_coupon; ?>");
});
});
</script>
Also check jquery library included or not

Related

div #id in foreach loop only selects last variable when trying to show/hide in function

I am navigating through a simple foreach loop to get "blog posts". It shows basic blog information, a reply and delete button. When I select the 'reply' button, a small form beneath the reply button appears to fill out. The problem is, the function I am passing the variable to, only gets the last id for the form. How do I change my function or div element to be unique for each instance?
I have tried setting up PHP #echo variable's on the "id" and function, I have checked all my opening and closing brackets 10-fold. I have tried using different GetElementBy ... methods. I started looking into Jquery but I wanted to get this finished with PHP/Javascript only.
<?php foreach ($mainentries as $entry) :
$subentryID = $entry['SubEntryID'];
if ($subentryID == "0")
{ ?>
<div><tr><td><?php echo ('#'.$entry['EntryID'].' - ')?></td>
<td><?php echo $entry['Body']; ?></td>
<br />
<?php foreach($subentries as $subentry) : ?>
<?php if ($subentry['SubEntryID'] == $entry['EntryID'])
{ ?>
<div id="subposts">
<td><td><td>#<?php echo $subentry['EntryID'];?></td><br>
<td>
<?php echo $subentry['Body']; ?>
</td></td></td>
</div>
<?php } endforeach; ?>
<br />
<td>
<button onclick="cookiechecksub()">Reply</button>
<?php echo $entry['EntryID'];
$subform = $entry['EntryID']; ?>
<div id="<?php echo $subform?>" style="display:none">
<form action="Add_subentry.php" method="post" id="Add_subentry">
<label>Title:</label><br />
<input type = "text" name="Title" class="Title"/> <br />
<label>Body</label><br />
<div class="area">
<input type = "textarea" name="Body" class="Body"/><br />
</div>
<input type="hidden" readonly="true" name="EntryID" value="<?php echo $entry['EntryID']; ?>" />
<input type=submit id="btnReply" value="Submit Reply"/>
</form>
</div></td>
<td>
<form action="Delete_entry.php" method="post" id="Delete_entry">
<input type="hidden" readonly="true" name="EntryID" value="<?php echo $entry['EntryID']; ?>" />
<?php if ($userid == 1)
{ ?>
<input type="submit" id="btnDelete" value="Delete Post"/>
<?php } ?>
<br /><br />
</form>
</td>
</tr>
</div>
<?php
} endforeach; ?>
<Script>
function cookiechecksub() {
if (!userid) {
if (confirm("Please log in first")) {
window.location.replace("http://localhost/alexdes/login-logout.php");
}
}
else {
TryAddSubPost();
}
}
function TryAddSubPost()
{
var x = document.getElementById("<?php echo $subform?>");
if (x.style.display === "none")
{
x.style.display="block";
}
else
{
x.style.display="none";
}
}
</Script>
this is because you used php echo in the js function especially in TryAddSubPost
change it to be like this:
<script>
function cookiechecksub(id) {
if (!userid) {
if (confirm("Please log in first")) {
window.location.replace("http://localhost/alexdes/login-logout.php");
}
}
else {
TryAddSubPost(id);
}
}
function TryAddSubPost(id)
{
var x = document.getElementById(id);
if (x.style.display === "none")
{
x.style.display="block";
}
else
{
x.style.display="none";
}
}
</script>
and use the id from php only when calling the function, like this:
<button onclick="cookiechecksub('<?php echo $entry['EntryID']?>')">Reply</button>
Give cookiechecksub an argument, and pass it to TryAddSubPost
<button onclick="cookiechecksub('<?=$entry['EntryID']?>')">

How can I send to Javascript form elements values. Constantly sending one value

<script>
function tikla()
{
//var radio=document.getElementById('radio').value;
var d2=document.getElementById('buton').value;
alert(d2);
}
</script>
<?php
for($i=1;$i<5;$i++)
{?>
<form>
<?php echo $i; ?>
<input type="text" name="txt" value="<?php echo $i; ?>" disabled="disabled" />
<input type="button" id="buton" value="<?php echo $i; ?>" onclick="tikla(this.value)" />
</form>
<?php }?>
In PHP, I want to send button or text values to Javascript but I can send only one value. I can't see other loop values.
Is it really the intention to have multiple forms? There is no reason why not of course but you can accomplish what you need, generally speaking, using a single form.
By using a nodelist you can iterate through and assign event listeners separately to the HTML - inline event handlers are considered old school nowadays. In this example the event handler is assigned to each button and simply alerts the numeric value assigned to the button ( as in your example ) and also the value and type of the text field to show how you might access it if required.
A quick demo
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8' />
<title>JS Func</title>
<style>
fieldset{border:none;margin:1rem auto}
</style>
</head>
<body>
<form>
<?php
for( $i=1; $i<5; $i++ ) {
$rand = rand(1,99);
?>
<fieldset>
<?php echo $i; ?>
<input type='text' name='txt[]' value='<?php echo $i * $rand; ?>' />
<input type='button' value='<?php echo $i; ?>' />
</fieldset>
<?php
}
?>
</form>
<script>
Array.prototype.slice.call( document.querySelectorAll( 'form > fieldset > input[type="button"]' ) ).forEach( function( bttn ){
bttn.addEventListener('click', function(event){
alert( this.value +' '+this.previousElementSibling.value + ' ' +this.previousElementSibling.tagName )
}, false );
})
</script>
</body>
</html>
pass values in function
<script>
function tikla(val)
{
//var d2=document.getElementById('buton').value;
alert(val);
}
</script>
<?php
for($i=1;$i<5;$i++)
{?>
<form>
<?php echo $i; ?>
<input type="text" name="txt" value="<?php echo $i; ?>" disabled="disabled" />
<input type="button" id="buton" value="<?php echo $i; ?>" onclick="tikla(<?php echo $i; ?>)" />
</form>
<?php }?>

Using Ajax to insert data but it's taking time to insert

i'm using ajax to insert data into mysql but if i press the submit button it's taking more time to insert data hopefully someone here can do better than me please give a feedback.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type ="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
My Ajax Code:
<script>
$(document).ready(function(){
$("#button").click(function(e){
e.preventDefault();
var usId=$("#userId").val();
var mailId=$("#mailId").val();
var palId=$("#palId").val();
var mtext=$("#umText").val();
setInterval(function(){
$('#loadMesg').load("../validate/getMessage.php?mailId=<?php echo $_GET["mailId"]; ?>").fadeIn("slow");
}, 200);
$.ajax({
url:'../validate/updateMails.php',
method:'POST',
data:{
u_id:usId,
pal_id:palId,
u_mtext:mtext
},
success:function(data){
//alert(data);
$("#umText").val('');
$('#loadMesg').load("../validate/getMessage.php?mailId=<?php echo $_GET["mailId"]; ?>").fadeIn("slow");
}
});
});
});
</script>
And my Submit Form :
<form>
<input type="hidden" id="mailId" name="mailId" value="<?php echo $_GET["mailId"]; ?>">
<input type="hidden" id="palId" name="palId" value="<?php echo $_GET["palId"]; ?>">
<input type="hidden" id="userId" name="userId" value="<?php echo $_SESSION["u_id"]; ?>">
<textarea placeholder="Write M-Mail" id="umText" name="umText" class="input"></textarea>
<button type="submit" title="send" id="button"><i class="fa fa-paper-plane"></i></button>
</form>
https://code.jquery.com/jquery-latest.min.js
//link for JQuery latest version
Add only one JS:
<script src="http://code.jquery.com/jquery-latest.min.js"></script>

I want to hide the submit button based on a PHPcondition through javascript

<?php
if(mysql_num_rows($result5)>0)
{
echo 'condition matched';
// the above echo is just for testing
?>
<script type='text/javascript'>
document.getElementById("submitbtn").style.display = "none";
</script>
<?php
}
?>
here I am evaluating an if clause, if the condition is true, I want to hide the submit button of the form.
<form action='xyz.php'>
<input type='text'>
<input type='text'>
<input type='text'>
<input type='submit' id='submitbtn' name='save' value='SAVE' class='form_btn' >
</form>
The condition is evaluating to true, but the submit button is still visible. How do I achieve this??
try using this way....
<input type='submit' <?php if($result5->num_rows>0) {?> disabled="disabled" <?php } ?> id='submitbtn' name='save' value='SAVE' class='form_btn' >
may be it will help
I had tied your code,and these worked ok, so I think must have other problems to affected your js code, such as a same name Id of submitbtn, or a js error.
If you want to use js try this :
<?php
if(mysql_num_rows($result5)>0)
{
echo 'condition matched';
// the above echo is just for testing
?>
<script type='text/javascript'>
$(document).ready(function(){
document.getElementById("submitbtn").style.display = "none";
});
</script>
<?php
}
?>
You can achieve this by using php too.
<input type='submit' id='submitbtn' name='save' value='SAVE' class='form_btn' <?php if(mysql_num_rows($result5)>0) echo 'style="display:none"';?>>
Posting the answer because all others are just disabling the button. It will still be visible. So to hide the button, use:
window.onload = function(){
document.getElementById("<id of your submit button>").style.display = "none";
}
inside the if(condition=true)
OR
<input type='submit' name="sbmt" id="id_1"<?php if(condition=true) { ?> style="display: none" <?php } ?> />
but since your question has asked exceptionally for "javascript" i will go one step further and write
<input type='submit' name="sbmt" id="id_1"
<?php if(condition=true) { ?>
<script type='text.javascript'>
document.getElementById("id_1").style.display = "none";
</script>
<?php } ?>
/>
Try as below : jQuery must be there on your page.
On calling the statement on page ready will solve the problem.
<?php
if(mysql_num_rows($result5)>0)
{
echo 'condition matched';
// the above echo is just for testing
?>
<script type='text/javascript'>
$( document ).ready(function() {
document.getElementById("submitbtn").style.display = "none";
});
</script>
<?php
}
?>
I Think you added your php codes before that form loads!
So you need window.onload OR Replace your php codes to after form
<?php
if(mysql_num_rows($result5)>0)
{
echo 'condition matched';
?>
<script type='text/javascript'>
window.onload = function(){
document.getElementById("submitbtn").style.display = "none";
}
</script>
<?php
}
?>
<?php
if(mysql_num_rows($result5)>0)
{
echo'<div style='visibility:hidden' id="del">';
echo'<script>
$(document).ready(function(e) {
$("#del").css("visibility", "visible");
});
</script>';
}
?>
It is not none it's :
<script type='text/javascript'>
document.getElementById("submitbtn").style.visibility = "hidden";
</script>

Why does my javascript not update quantity in Opencart category.tpl

In category.tpl Opencart 1.5.x
I'm trying to add quantity to the add to cart button.
<div class="cart">
<input type="text" name="quantity<?php echo $product['product_id']; ?>" value="1" size="1" />
<input type="button" value="<?php echo $button_cart; ?>" onclick="addToCart('<?php echo $product['product_id']; ?>', 'document.form.quantity<?php echo $product['product_id']; ?>.value')" class="button" />
</div>
If I just put a number in for the second variable of addToCart like
addToCart('<?php echo $product['product_id']; ?>', 2);
This adds quantity 2 fine. Checking the element name in ff shows me the number is coming back from php correctly "quantity6.value", etc. Apparently, but when I click Add to Cart nothing happens. Can someone point me in the right direction?
Just to make it more succinct I changed the line to:
" onclick="addToCart('', document.getElementById('quantity').value)" class="button" />
But still the button does not appear to do anything on a click. I assume the document.getElementById().. line is not returning the number properly, but I'm not sure of a good way to test it.
Neither does this seem to work:
<div class="cart">
<input type="text" name="quantity<?php echo $product['product_id']; ?>" value="1" size="1" onchange="updateQty(<?php echo $product['product_id']; ?>);" />
<input type="button" value="<?php echo $button_cart; ?>" onclick="addToCart('<?php echo $product['product_id']; ?>', getQty(<?php echo $product['product_id']; ?>);)" class="button" />
</div>
...
<script type="text/javascript"><!--
function getQty(num) {
getQty = document.getElementById('quantity' & num).value;
}
function updateQty(num) {
var ibox = document.form.quanity[num].value;
quantity[num] = ibox;
}
...
</script>
This seems a little overdone to be honest. You can do this with one function simply by changing the function on the onclick event to addToCartCategory() and changing the name to an ID for the quantity box. Something along the lines of
<div class="cart">
<input type="text" id="quantity<?php echo $product['product_id']; ?>" value="1" size="1" />
<input type="button" value="<?php echo $button_cart; ?>" onclick="addToCartCategory(<?php echo $product['product_id']; ?>)" class="button" />
</div>
...
<script type="text/javascript"><!--
function addToCartCategory(product_id) {
var qty = $('#quantity' + product_id).val();
addToCart(product_id, qty);
}
...
</script>

Categories

Resources