I'm trying to add a PayPal button to a WordPress page (the textarea input uses TinyMCE version 3.5.8). The PayPal button has the following code:
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="paypal"><input type="hidden" name="cmd" value="_s-xclick" />
<input type="hidden" name="hosted_button_id" value="SOME_ID" />
<table>
<tbody>
<tr>
<td><input type="hidden" name="on0" value="Choose:" />Choose</td>
</tr>
<tr>
<td><select name="os0"><option value="Choice">Choice</option></select></td>
</tr>
</tbody>
</table>
<input type="hidden" name="currency_code" value="USD" />
<input type="image" alt="PayPal - The safer, easier way to pay online!" name="submit" src="https://www.paypalobjects.com/en_US/i/btn/btn_cart_LG.gif" />
<img alt="" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1" border="0" />
</form>
Putting this HTML on the page works just fine, except there's a blank space above the table. Upon attemping to delete this extra space, TinyMCE removes the hidden inputs above the table.
Is there any way I can make TinyMCE not delete hidden inputs?
P.S. Since this is WordPress, I very-well could just put the PayPal code in custom shortcode; however I'd like to avoid this because it doesn't solve the real problem.
Have a look at the tinymce settings valid_elements and valid_children. You might need to set all the tags you use as valid tags and define the possible children to parentElements.
Tinymce has a cleanup function that strips the content of invalid code.
Related
I'm just starting to develop with ASP.NET and the paypal API and one of the first things I've done is auto-generate the HTML for a PayPal buy now button.
<form action="https://www.paypal.com/cgi-bin/webscr" method="post"
target="_top">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="encrypted" value="//my key">
<input type="image"
src="https://www.paypalobjects.com/en_US/GB/i/btn/btn_buynowCC_LG.gif"
border="0" name="submit" alt="PayPal – The safer, easier way to pay online!">
<img alt="" border="0"
src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
</form>
This constructs a button for me which is great. However upon clicking, instead of going to the https://www.paypal.com/cgi-bin/webscr URL as expected. I simply get a page post back to "/Default".
Do I need to set up anything else with the button?
Is there a way to send custom data to Paypal when using a simple button to make payments?
<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="D9DRKKKXPX5VL">
<input type="image" src="https://www.sandbox.paypal.com/en_US/i/btn/btn_subscribeCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.sandbox.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>
I'd like to have field in this form where I can set a value and get it back with IPN. Is this possible at all?
I believe you can pass custom data through a button with this:
<input name="custom" type="hidden" id="custom" value="stuff">
Cheers,
I have a problem with integrating Paypal Shopping Cart to my ASP.NET C# project.
The problem is that Paypal Shopping Cart is inside a FORM tag, so if I place that inside my server form tag it won't work.
It would look like this:
<body>
<form id="form1" runat="server">
<form target="_self" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_cart">
<input type="hidden" name="business" value="MySecretEmail#hidden.com">
<input type="hidden" name="display" value="1">
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_viewcart_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>
</form>
</body>
Is there any way I can prevent this from happening? I've search on google and here on Stackoverflow where I found this link: PayPal Name-Value Pair API Basics, but honestly, it doesn't make any sense to me since I'm not a programmer.
Thank you!
The simplest way to solve this problem is to use the PostBackUrl property of the asp:button. Using this method, the ASP generates your JavaScript to handle the external post.
This allows the rendering of the form to happen correctly and doesn't require any workaround. Remember that as your code is already in a form tag, your paypal items don't need to be wrapped in an extra tag.
e.g.
<input type='hidden' name='cmd' value='_cart'/>
<input type='hidden' name='upload' value='1'/>
<input type='hidden' name='business' value='business#business.com'/>
<input type='hidden' name='currency_code' value='aud'/>
<input type='hidden' name='item_number_1' value='item number_1'>
<input type='hidden' name='item_name_1' value='16x16 inch square canvas'>
<input type='hidden' name='amount_1' value='70'>
<input type='hidden' name='item_number_2' value='item number_2'>
<input type='hidden' name='item_name_2' value=' 48x20 rectangular canvas'>
<input type='hidden' name='amount_2' value='104'>
<asp:Button ID="Button1" PostBackUrl='https://www.paypal.com/cgi-bin/webscr' runat="server" />
Hope this helps.
Technically, your example isn't valid HTML. In the longer term, you might be best refactoring this code to remove your 'technical debt'. (See "must not contain other form elements" under element prohibitions on the W3C site for XHTML 1.0)
In the meantime, you could try submitting the nested form with jQuery.
1. Replace Submit Button
<button class="submit-button" id="submit-button">Submit Payment</button>
2. Amend Form Tag
<form id="nested-form" target="_self" action="https://www.paypal.com/cgi-bin/webscr" method="post">
3. Submit form using jQuery
<script type="text/javascript">
$('#submit-button').live('click',function() {
$('#nested-form').submit();
});
</script>
I haven't had a chance to test this, so please test and let me know if it works for you.
Here's a very easy method. It's what I use exclusively so I know with 100% certainty that it works.
Create a "false" image only PayPal button.
User clicks this button (it's just an image)
This image has an onclick method which calls a 2 line javascript function (see below)
Put your "real" PayPal button form at the end of your page AFTER the closing form tag.
Enclose it in a SPAN tag with style="display:none;"
Add ID="ppsubmit" to the "real" button's image input
When user click the false button, the onclick method calls a javascript function that does just 2 things ... a) changes span display to inline and b) automatically clicks the real PayPal button.
<form id="form1" runat="server">
<!-- Here's the image only "false" paypal button -->
<input type="image"
src="https://www.sandbox.paypal.com/en_US/i/btn/btn_subscribeCC_LG.gif"
border="0" name="submit" alt="PayPal - The safer, easier way to pay online!"
onclick="javascript:doPPform();" />
</form> <!-- this closes your asp.net form -->
<!-- Here's the hidden span with the real paypal button
at the bottom of your webpage -->
<span id="ppform" style="display: none;">
<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post"
target="_top">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="xxxxx">
<input id="ppsubmit" type="image"
src="https://www.sandbox.paypal.com/en_US/i/btn/btn_subscribeCC_LG.gif"
border="0" name="submit"
alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0"
src="https://www.sandbox.paypal.com/en_US/i/scr/pixel.gif"
width="1" height="1">
</form>
</span>
<!-- Here's the 2 line javascript code when the user clicks the "false" button -->
<script language="javascript" type="text/javascript">
function doPPform() {
document.getElementById("ppform").style.display = "inline";
document.getElementById("ppsubmit").click();
}
</script>
A quick solution would be to put the paypal form inside an iframe.
On the form element, change target="_parent" so it posts back to the parent page.
Why don't you make the page the payment form is on use a MasterPage that has the tag removed. I do this on all the sites and it works without problems.
I discovered the PayPal button problem before I discovered that it is an ASP.NET problem.
In the process of creating buttons and adding to my page, sometimes they would work and sometimes they would not. Then I would have 2 identical buttons and the second would work and the first would not. Remove the first and then the button that worked would not. To get to the point if I added a form tag before my PayPal button the Paypal button works.
<%-- simple form tag --%>
<form action="">
</form>
<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_xclick">
<input type="hidden" name="business" value="hughet_1335403121_biz#yahoo.com">
<input type="hidden" name="lc" value="US">
<input id="iptItemName" type="hidden" name="item_name" value="testBuyNow">
<input type="hidden" name="amount" value="10.00">
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="button_subtype" value="products">
<input type="hidden" name="no_note" value="0">
<input type="hidden" name="cn" value="Add special instructions to the seller">
<input type="hidden" name="no_shipping" value="2">
<input type="hidden" name="bn"
value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHosted">
<input type="image"
src="https://www.sandbox.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif"
border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0"
src="https://www.sandbox.paypal.com/en_US/i/scr/pixel.gif"
width="1" height="1">
</form>
I understand this a "hack fix", and I'm not sure why this works. Curious if this works for others.
I have an asp:RadioButtonList named rblDependants
which renders as follows and a panel pnlDependants and I need to hide it when radio button selection is "No" and show it when its "Yes". I have tried a few snippets from the forums and none seem to work fine. Can anyone help me pls....!
<table id="ctl00_ContentPlaceHolder1_ctl02_rblDependants" border="0" style="border-width:0px;">
<tr>
<td><input id="ctl00_ContentPlaceHolder1_ctl02_rblDependants_0" type="radio" name="ctl00$ContentPlaceHolder1$ctl02$rblDependants" value="Yes" /><label for="ctl00_ContentPlaceHolder1_ctl02_rblDependants_0">Yes</label></td>
</tr><tr>
<td><input id="ctl00_ContentPlaceHolder1_ctl02_rblDependants_1" type="radio" name="ctl00$ContentPlaceHolder1$ctl02$rblDependants" value="No" checked="checked" /><label for="ctl00_ContentPlaceHolder1_ctl02_rblDependants_1">No</label></td>
</tr>
</table>
<div id="ctl00_ContentPlaceHolder1_ctl02_pnlDependants">
<div class="QuestionWrapper">
<div class="Question">
<label for="">No. of Dependants</label>
</div>
<div class="Answer">
<input name="ctl00$ContentPlaceHolder1$ctl02$txtNoOfDependants" type="text" maxlength="2" id="ctl00_ContentPlaceHolder1_ctl02_txtNoOfDependants" />
</div>
<div class="ClearFloat"></div>
</div>
Something like this should work:
$("table[id$=_rblDependants] :radio").change(function() {
$(this).closest('table').next().toggle(this.checked && this.value == 'Yes');
}).change();
This would work for any number of repeated controls since it finds the <div id="X_pnlDependants"> relatively. All we're doing it taking an <table> who's ID ends-with _rblDependants, taking any :radio buttons inside it and binding to their .change() event. Then either of them is changed it's checking that the result was value="Yes" and it was .checked, if that's the case show the panel, otherwise hide it, via .toggle(bool).
The .closest() and .next() are to go up to the <table> then to the next element, the <div>, since that's what you want to hide/show. The .change() on the end is to trigger the handler initially, so if "No" is initially checked, it hides the <div> on load.
You can give it a try here
I confess I am a noob to asp.net and web forms. I'm having an issue incorporating a few PayPal Buy Now buttons on a single page. Basically, the problem is no matter which "Buy Now" button is clicked, the user is taken to paypal to buy the product represented by the last button on the page.
The code for my first button is something like this...
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="ABC123">
<asp:ImageButton runat="server" id="PPImageButton1" PostBackUrl="https://www.paypal.com/cgi-bin/webscr" ImageUrl="https://www.paypal.com/en_US/i/btn/btn_buynow_SM.gif"/>
My second button is similar to...
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="ABC456">
<asp:ImageButton runat="server" id="PPImageButton2" PostBackUrl="https://www.paypal.com/cgi-bin/webscr" ImageUrl="https://www.paypal.com/en_US/i/btn/btn_buynow_SM.gif"/>
How can I make the first button send value ABC123 to the PayPal service instead of ABC456?
Thanks in advance.
The POST content of a button is every input in the FORM tag that surrounds the submit button. So to have each button submit a separate set of hidden fields you need to wrap the button and the desired hidden fields in a separate form:
<form ... >
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="ABC123">
<asp:ImageButton runat="server" id="PPImageButton1" PostBackUrl="https://www.paypal.com/cgi-bin/webscr" ImageUrl="https://www.paypal.com/en_US/i/btn/btn_buynow_SM.gif"/>
</form>
<form ... >
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="ABC456">
<asp:ImageButton runat="server" id="PPImageButton1" PostBackUrl="https://www.paypal.com/cgi-bin/webscr" ImageUrl="https://www.paypal.com/en_US/i/btn/btn_buynow_SM.gif"/>
</form>
My noob solution for this was to cut each of the buy-it-now buttons and its associated fields out of the aspx page, and put each set in a separate html page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>first button</title>
</head>
<body>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="paypal">
<input type="hidden" value="_s-xclick" name="cmd" /> <input type="hidden" value="???????" name="hosted_button_id" />
<table>
<tbody>
<tr>
<td><input type="hidden" value="Member name" name="on0" />Member name</td>
<td><input maxlength="60" size="30" name="os0" /></td></tr>
<tr>
<td><input type="hidden" value="Membership No. (if known)" name="on1" />Membership No. (if known)</td>
<td><input maxlength="60" size="6" name="os1" /></td></tr></tbody></table>
<input type="image" alt="PayPal - The safer, easier way to pay online." src="https://www.paypal.com/en_GB/i/btn/btn_cart_LG.gif" name="submit" /> <img height="1" alt="" src="https://www.paypal.com/en_GB/i/scr/pixel.gif" width="1" border="0"/> </form>
</body>
</html>
In the place in the aspx page where you removed the button and other fields, insert an iframe which points to the html page like this:
<iframe width="600" height="" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="mybuttonpage1.htm"></iframe>
It's not your button that sends the value - it's the form it's in, and/or the code behind it.
Could you:
Post the form code?
Post the code behind for this page?
Here is a solution the the multiple form problem when using PayPal with ASP.NET:
http://www.codersbarn.com/post/2008/03/08/Solution-to-ASPNET-Form-PayPal-Problem.aspx
I discuss several workarounds for the problems of inserting PayPal code into an ASP.NET page, and present a different approach in my article at http://blackbeltcoder.com/Articles/ecommerce/quick-and-dirty-buy-now-buttons-in-asp-net.
In the end, you don't need to use a form because PayPal allows you to use a regular anchor link.
I was able to get it to work by removing all the other button containers from the DOM in jQuery. Add a class to your container, and add a CssClass to the ImageButton, "PayPalImageButtons"
<div>
Buy This First Product Below
</div>
<div class="ManualPurchase PayPalButtons">
<input type="hidden" name="cmd" value="_s-xclick" />
<input type="hidden" name="hosted_button_id" value="ABC123" />
<asp:ImageButton CssClass="PayPalImageButtons" runat="server" id="PPImageButton1" PostBackUrl="https://www.paypal.com/cgi-bin/webscr" ImageUrl="https://www.paypal.com/en_US/i/btn/btn_buynow_SM.gif" />
</div>
<div>
Buy This Second Product Below
</div>
<div class="ManualPurchase PayPalButtons">
<input type="hidden" name="cmd" value="_s-xclick" />
<input type="hidden" name="hosted_button_id" value="ABC456" />
<asp:ImageButton CssClass="PayPalImageButtons" runat="server" id="PPImageButton1" PostBackUrl="https://www.paypal.com/cgi-bin/webscr" ImageUrl="https://www.paypal.com/en_US/i/btn/btn_buynow_SM.gif" />
</div>
and the jQuery
<script type="text/javascript">
function pageLoad() {
$(".PayPalImageButtons").click(function (e) {
$(this).parent().addClass("keep");
$(".PayPalButtons").not(".keep").remove();
});
}
</script>
My next step is dealing with the removed elements height and maybe a Please Wait dialog while the PayPal page is loaded