minicart.js not working, cart is not popping up - javascript

I am using Minicart.JS for my simple paypal shopping cart. But this is not working as it should. The cart is not popping up if I click 'add to cart' button.
Here's my code.
<html>
<body>
<script src="//cdnjs.cloudflare.com/ajax/libs/minicart/3.0.3/minicart.min.js"></script>
<script>
paypal.minicart.render();
</script>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_cart" />
<input type="hidden" name="add" value="1" />
<input type="hidden" name="business" value="labs-feedback-minicart#paypal.com" />
<input type="hidden" name="item_name" value="Test Product" />
<input type="hidden" name="quantity" value="1" />
<input type="hidden" name="amount" value="1.00" />
<input type="hidden" name="currency_code" value="USD" />
<input type="hidden" name="no_shipping" value="2">
<input type="hidden" name="no_note" value="1">
<input type="hidden" name="shipping2" value="1.50">
<input type="hidden" name="shipping" value="2.50">
<strong>Test Product</strong>
<p>
<label><input type="checkbox" id="terms" name="terms" value="" /> I agree to the terms</label>
</p>
<input type="submit" name="submit" value="Add to cart" />
</form>
<script>
paypal.minicart.render();
paypal.minicart.cart.on('checkout', function (evt) {
var hasAgreed = !!document.getElementById('terms').checked;
if (!hasAgreed) {
alert('You must agree to the terms!');
evt.preventDefault();
}
});
</script>
</body>
</html>
Here is the actual site. , I found an error in console that said:
Uncaught TypeError: Cannot call method 'appendChild' of null
I am not sure how to fix this, please let me know what's wrong with my setup. Thanks.

You need to change the Add to cart button to not be saved on PayPal (In Profit and loss Section) and also unprotect code after the button is created right before you copy and paste it :)
Hope this helps :)

Related

Add % discount to Add to Cart HTML paypal button

I have tried several times and relied on the code snippets examples provided by paypal (https://www.paypal.com/mq/smarthelp/article/how-do-i-create-a-discount-code-or-coupon-code-for-my-paypal-buttons-ts1512).
Yet my button doesn't show any % discount as it should.
This is the HTML code snippet, trying to implement a 10% discount (I have just hidden my merchant ID):
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" onsubmit="this.target = 'paypal';
discnt = 10;
coupval = '(blanket)';
ReadForm (this);
discnt = 0;">
<input type="hidden" name="cmd" value="_cart" />
<input type="hidden" name="add" value="1" />
<input type="hidden" name="business" value="XXX" />
<input type="hidden" name="item_name" value="Test Item" />
<input type="hidden" name="amount" value="10.00" />
<input type="hidden" name="currency_code" value="USD" />
<input type="hidden" name="lc" value="US" />
<input type="hidden" name="baseamt" value="10.00" />
<input type="image" src="https://www.paypalobjects.com/en_GB/i/btn/btn_cart_LG.gif" border="0" name="submit" alt="PayPal – The safer, easier way to pay online!" name="submit" alt="add to cart" />
<img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
</form>
Does any of you know what am I missing/how to fix it?
Thank you so much, take the chance to wish you a good day!
Michele

paypal button form will not auto-submit in php file

I've got a paypal button form in a php file that I'm trying to auto-submit using javascript. It seems like it should be very straight forward, but when I test it, the submit button displays, and I am not automatically re-directed to paypal as expected. When I click the submit button I am redirected to paypal and everything looks right. I've read through all the similar posts, which is where I found the script I'm trying to use. I've been at this for several hours and have tried several different recommendations from other posts but I just can't get it to work. Any assistance would be very appreciated! The form code (with some values "xxx"'d out for security) and script is shown below. Note that some of the field values are populated with php.
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" id="paypalButton" name="paypalButton" target="_top" >
<input type="hidden" name="cmd" value="_xclick-subscriptions">
<input type="hidden" name="business" value="xxx">
<input type="hidden" name="lc" value="US">
<input type="hidden" name="item_name" value="<?php echo $_SESSION['item_name'];?>">
<input type="hidden" name="no_note" value="1">
<input type="hidden" name="no_shipping" value="1">
<input type="hidden" name="rm" value="1">
<input type="hidden" name="return" value="http://example.com/sucess.php">
<input type="hidden" name="cancel_return" value="http://example.com/Cancel.php">
<input type="hidden" name="src" value="1">
<input type="hidden" name="a3" value="<?php echo $_SESSION['price'];?>">
<input type="hidden" name="custom" value="<?php echo $_SESSION['deal_id'].$_SESSION['refresh_token'];?>">
<input type="hidden" name="p3" value="1">
<input type="hidden" name="t3" value="<?php echo $_SESSION['t3'];?>">
<input type="hidden" name="a1" value="<?php echo $_SESSION['a1'];?>">
<input type="hidden" name="p1" value="1">
<input type="hidden" name="t1" value="Y">
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="bn" value="xxx">
<input type="submit" name="submit">
</form>
<script type="text/javascript">
document.getElementById('paypalButton').submit(); // SUBMIT FORM
</script>
``
I think it should be (even if you have your JS after the Form is created):
window.onload = submit_document();
function submit_document(){
document.getElementById('paypalButton').submit();
}
If you had JQuery, you may even do:
$().ready(function(){
$("#frm1").paypalButton();
});
Would this work for you?

Same form multiple times on page, Get values of submitted form

I have the same form multiple times on my page, I'm trying to use jquery to detect which form is submitted and get its values. But currently only the first form on the page works and the other ones wont trigger. How can I fix this issue?
Forms look like this:
<form id="prepare_payment_form" action="#" method="post">
<input name="merchant_id" type="hidden" value="'.$paypal_acount.'"/>
<input name="merchant_amount" type="hidden" value="'.$entity_price.'"/>
<input name="site_owner_id" type="hidden" value="'.$site_owner_id.'"/>
<input name="site_owner_commission" type="hidden" value="'.$site_owner_commission.'"/>
<input name="currency_code" type="hidden" value="'.$entity_unit->currency.'"/>
<input name="use_sandbox" type="hidden" value="'.$use_sandbox.'"/>
<input name="entity_guid" type="hidden" value="'.$entity_unit->guid.'"/>
<input name="trackingId" type="hidden" value="'.$entity_unit->guid.'-'.$buyer->guid.'-'.$entity_unit->container_guid.'-'.time().'"/>
<input name="entity_plugin" type="hidden" value="'.$plugin_name.'"/>
<input id="prepare_payment" type="submit" name="prepare_payment" class="paypal_button" value="" />
</form>
Jquery code:
$("#prepare_payment").unbind('click').click(function(e) {
e.preventDefault();
var data = {
action: 'the_php_page_that_will_handle_the_request.php',
payment_data: $('#prepare_payment_form').serialize()
};
});
I figured it out thanks. used this:
form:
<form id="'.time().'" action="#" method="post">
<input name="merchant_id" type="hidden" value="'.$paypal_acount.'"/>
<input name="merchant_amount" type="hidden" value="'.$entity_price.'"/>
<input name="site_owner_id" type="hidden" value="'.$site_owner_id.'"/>
<input name="site_owner_commission" type="hidden" value="'.$site_owner_commission.'"/>
<input name="currency_code" type="hidden" value="'.$entity_unit->currency.'"/>
<input name="use_sandbox" type="hidden" value="'.$use_sandbox.'"/>
<input name="entity_guid" type="hidden" value="'.$entity_unit->guid.'"/>
<input name="trackingId" type="hidden" value="'.$entity_unit->guid.'-'.$buyer->guid.'-'.$entity_unit->container_guid.'-'.time().'"/>
<input name="entity_plugin" type="hidden" value="'.$plugin_name.'"/>
<input id="prepare_payment" type="submit" name="prepare_payment" class="paypal_button" value="" />
</form>
Jquery:
$("form").submit(function (e) {
e.preventDefault();
var data = {
action: 'the_php_page_that_will_handle_the_request.php',
payment_data: $(this).serialize()
};
});

Disable form submission if checkbox is unchecked

I am trying to use function checkbox() to disable form submission.
Can anyone suggest what am i doing wrong?
Thanks in advance.
Here is the code snippet for the JS:
<script type = "text/javascript">
function checkbox() {
if(document.form.checkbox.checked)
{
document.form.submit.disabled=false;
}
else
{
document.form.submit.disabled=true;
}
}
</script>
And here is the HTML code.
<form name="form" action="shop_paypal.php" method="post">
<input name="cmd" type="hidden" value="_xclick" />
<input name="no_note" type="hidden" value="1" />
<input name="lc" type="hidden" value="UK" />
<input name="currency_code" type="hidden" value="USD" />
<input name="bn" type="hidden" value="PP-BuyNowBF:btn_buynow_LG.gif:NonHostedGuest" />
<input type="hidden" name="item_name" id="item_name"value="YOUTUBE"/>
<select name="amount" id="amount" style="width:256px; height:32px;">
<option value="18" id="1">10,000 PINS - $18 </option>
<option value="35" id="2">20,000 PINS - $35</option>
<option value="75" id="3">30,000 PINS - $75</option>
<option value="140" id="4">50,000 PINS - $140</option>
</select>
<label>Your Facebook fan page URL: </label><br />
<input class="input-box" type="text" />
<input type="text" />
<input type="checkbox" class="checkbox" name="checkbox" id="checkbox"/>
<label class="agree">I agree to Terms & Conditions</label>
<input type="image" src="images/products/buynow.gif" class="submit" onclick= "checkbox();" name = "submit"/>
</form>
The obvious first thought would be:
var form = document.getElementsByTagName('form')[0];
function check (){
return document.getElementById('checkbox').checked;
}
form.addEventListener('submit', check);
Try this and notice how the function is simplyfied and calling is moved to the checkbox itself. When it's checked, button is enabled, and when unchecked, it's disabled (this is also a default state).
Here's also a working demo: http://jsfiddle.net/kL7We/
<script>
function enableSending() {
document.form.submit.disabled = !document.form.checkbox.checked;
}
</script>
<form name="form" action="shop_paypal.php" method="post">
<input name="cmd" type="hidden" value="_xclick" />
<input name="no_note" type="hidden" value="1" />
<input name="lc" type="hidden" value="UK" />
<input name="currency_code" type="hidden" value="USD" />
<input name="bn" type="hidden" value="PP-BuyNowBF:btn_buynow_LG.gif:NonHostedGuest" />
<input type="hidden" name="item_name" id="item_name"value="YOUTUBE"/>
<select name="amount" id="amount" style="width:256px; height:32px;">
<option value="18" id="1">10,000 PINS - $18 </option>
<option value="35" id="2">20,000 PINS - $35</option>
<option value="75" id="3">30,000 PINS - $75</option>
<option value="140" id="4">50,000 PINS - $140</option>
</select>
<label>Your Facebook fan page URL: </label><br />
<input class="input-box" type="text" />
<input type="text" />
<input type="checkbox" class="checkbox" name="checkbox" id="checkbox" onclick= "enableSending();"/>
<label for="checkbox" class="agree">I agree to</label> Terms & Conditions
<input type="button" src="images/products/buynow.gif" class="submit" name = "submit" value="Send" disabled="disabled"/>

Set a html form with javascript

I've been playing with the PayPal code:
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" name="paypal">
<input type="hidden" name="cmd" value="_cart">
<input type="hidden" name="upload" value="1">
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="business" value="test#test.org">
<input type="hidden" name="item_name_1" value="Item1">
<input type="hidden" name="amount_1" value="1.00">
<input type="hidden" name="item_name_2" value="Item2">
<input type="hidden" name="amount_2" value="2.00">
<input type="submit" value="PayPal">
</form>
And I want to set the value of item_name_1 and amount_1 via javascript when a button is pressed elsewhere so when that form is submitted the values are all set:
So I have this function run when the add to cart is clicked:
<script type='text/javascript'>
function addtocart(){
paypal.item_name_2.value="Hello!";
}
</script>
I feel I'm on the right tracks but no joy. Help please! TIA
Try this
document.forms["paypal"].item_name_2.value="heelo";
try this
document.forms['paypay']['item_name_2'].value = "hello";

Categories

Resources