MediaWiki:Secure_HTML and Google Checkout button formatting - html

I'm using the MediaWiki:Secure_HTML extension, and trying to render a Google Checkout button I generated.
The button code is this:
<form action="https://checkout.google.com/api/checkout/v2/checkoutForm/Merchant/XXXXXXXXX" id="BB_BuyButtonForm" method="post" name="BB_BuyButtonForm" target="_top">
<table cellpadding="5" cellspacing="0" width="1%">
<tr>
<td align="right" width="1%">
<select name="item_selection_1">
<option value="1">$80.00 - Freeside Membership Dues (Standard)</option>
<option value="2">$40.00 - Freeside Membership Dues (Starving Hacker)</option>
<option value="3">$65.00 - Freeside Membership Dues (Joint-MIC)</option>
</select>
<input name="item_option_name_1" type="hidden" value="Freeside Membership Dues (Standard)"/>
<input name="item_option_price_1" type="hidden" value="80.0"/>
<input name="item_option_description_1" type="hidden" value=""/>
<input name="item_option_quantity_1" type="hidden" value="1"/>
<input name="item_option_currency_1" type="hidden" value="USD"/>
<input name="item_option_name_2" type="hidden" value="Freeside Membership Dues (Starving Hacker)"/>
<input name="item_option_price_2" type="hidden" value="40.0"/>
<input name="item_option_description_2" type="hidden" value=""/>
<input name="item_option_quantity_2" type="hidden" value="1"/>
<input name="item_option_currency_2" type="hidden" value="USD"/>
<input name="item_option_name_3" type="hidden" value="Freeside Membership Dues (Joint-MIC)"/>
<input name="item_option_price_3" type="hidden" value="65.0"/>
<input name="item_option_description_3" type="hidden" value=""/>
<input name="item_option_quantity_3" type="hidden" value="1"/>
<input name="item_option_currency_3" type="hidden" value="USD"/>
</td>
<td align="left" width="1%">
<input alt="" src="https://checkout.google.com/buttons/buy.gif?merchant_id=XXXXXXXXX&w=121&h=44&style=white&variant=text&loc=en_US" type="image"/>
</td>
</tr>
</table>
</form>
I am able to get the button to show up on my page edit just fine - however, the formatting is completely off. It appears that the <input type="hidden"> items for each of my drop-down options is being rendered, which is adding a lot of whitespace. The items aren't visible, but in the generated Secure HTML it appears like this, more or less:
I'm hoping to either use some CSS to correct the mess, or maybe there's another extension that's more appropriate or handles <input> better?

Turns out putting in whitespace may generate artifact <pre> tags via the Markdown, so there's some bugs with respect to formatting the code within the <shtml>. Removing a lot of the whitespace in code that gets hashed by the Secure_HTML resolves the problems.

Wrap the chunk of hidden inputs in a block element. To neaten up a bit you can move that block to the top of the form -above the table. Since the input tags will still be inside a block-level element (the fieldset tags) it will remain valid XHTML.
<form action="https://checkout.google.com/api/checkout/v2/checkoutForm/Merchant/XXXXXXXXX" id="BB_BuyButtonForm" method="post" name="BB_BuyButtonForm" target="_top">
<fieldset style=”display: none”>
<input name="item_option_name_1" type="hidden" value="Freeside Membership Dues (Standard)"/>
<input name="item_option_price_1" type="hidden" value="80.0"/>
<input name="item_option_description_1" type="hidden" value=""/>
<input name="item_option_quantity_1" type="hidden" value="1"/>
<input name="item_option_currency_1" type="hidden" value="USD"/>
<input name="item_option_name_2" type="hidden" value="Freeside Membership Dues (Starving Hacker)"/>
<input name="item_option_price_2" type="hidden" value="40.0"/>
<input name="item_option_description_2" type="hidden" value=""/>
<input name="item_option_quantity_2" type="hidden" value="1"/>
<input name="item_option_currency_2" type="hidden" value="USD"/>
<input name="item_option_name_3" type="hidden" value="Freeside Membership Dues (Joint-MIC)"/>
<input name="item_option_price_3" type="hidden" value="65.0"/>
<input name="item_option_description_3" type="hidden" value=""/>
<input name="item_option_quantity_3" type="hidden" value="1"/>
<input name="item_option_currency_3" type="hidden" value="USD"/>
</fieldset>
<table cellpadding="5" cellspacing="0" width="1%">
<tr>
<td align="right" width="1%">
<select name="item_selection_1">
<option value="1">$80.00 - Freeside Membership Dues (Standard)</option>
<option value="2">$40.00 - Freeside Membership Dues (Starving Hacker)</option>
<option value="3">$65.00 - Freeside Membership Dues (Joint-MIC)</option>
</select>
</td>
<td align="left" width="1%">
<input alt="" src="https://checkout.google.com/buttons/buy.gif?merchant_id=XXXXXXXXX&w=121&h=44&style=white&variant=text&loc=en_US" type="image"/>
</td>
</tr>
</table>

Related

PayPal code works until I add prices for options?

Not sure what to ask exactly but I've followed the instructions on the PayPal Developer site:
https://developer.paypal.com/docs/classic/paypal-payments-standard/integration-guide/buynow_buttons/
have another question though. I have a form:
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
<input type="hidden" name="cmd" value="_xclick">
<input type="hidden" name="business" value="myemail#myaddress.com">
<input type="hidden" name="bn" value="MR_BuyNow_WPS_CA">
<input type='hidden' name='lc' value='CA'>
<input type="hidden" name="currency_code" value="CAD">
<input type="hidden" name="no_shipping" value="0">
<input type="hidden" name="no_note" value="1">
<input type="hidden" name="return" value="/design/payments/success/">
<input type="hidden" name="cancel_return" value="/design/payments/failed/">
<input type="hidden" name="cbt" value="Return to MR">
<input type="hidden" name="item_number" value="buy-time">
<table>
<tr><td>
<p>Provide the following:</p>
</td></tr>
<tr><td>
<div class="row collapse">
<div class="small-3 columns">
<span class="prefix"><span data-tooltip aria-haspopup="true" class="has-tip" title="Please provide your full name as it appears on the order form.">Name:</span></span>
</div>
<div class="small-9 columns">
<input type="text" placeholder="What is your name?" name="os0" maxlength="200">
</div>
</div>
<div class="row collapse">
<div class="small-12 columns">
<select name="item_name">
<option value="Maintenance Hours">Maintenance</option>
<option value="General Work Hours">General Work (Additions, etc.)</option>
</select>
</div>
</div>
<div class="row collapse">
<div class="small-12 columns">
<select name="os1">
<option value="2 Hours ($50/Hour)">2 Hours ($50/Hour) - $100.00 CAD</option>
<option value="3 Hours ($45/Hour)">3 Hours ($45/Hour) - $135.00 CAD</option>
<option value="4 Hours ($45/Hour)">4 Hours ($45/Hour) - $180.00 CAD</option>
<option value="5 Hours ($45/Hour)">5 Hours ($45/Hour) - $225.00 CAD</option>
<option value="6 Hours ($45/Hour)">6 Hours ($45/Hour) - $270.00 CAD</option>
</select>
</div>
</div>
</td></tr>
</table>
<input type="hidden" name="on0" value="Client">
<input type="hidden" name="on1" value="Hours">
<input type="image" class="payments-buy" src="http://mrobertsdesign.ca/img/payments_buy.png" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
</form>
Now it technically works (it at least goes through to the paypal purchase page) until I actually add the prices for the buttons:
<input type="hidden" name="option_select0" value="2 Hours">
<input type="hidden" name="option_amount0" value="100.00">
<input type="hidden" name="option_select1" value="3 Hours">
<input type="hidden" name="option_amount1" value="135.00">
<input type="hidden" name="option_select2" value="4 Hours">
<input type="hidden" name="option_amount2" value="180.00">
<input type="hidden" name="option_select3" value="5 Hours">
<input type="hidden" name="option_amount3" value="225.00">
<input type="hidden" name="option_select4" value="6 Hours">
<input type="hidden" name="option_amount4" value="270.00">
If anyone with any experience could point out something I'm missing that would be great =)
I'm not entirely sure what your goal is, but would it be easier to use PayPal's built in use of dropdowns for a button? Since you are basically saying that the hourly rate is discounted you could use a buy now button that is set for $50 and if they choose a quantity of 3 or more it is discounted to $45. Hope this helps.
It turns out that the value of ABC in <option value="A">, <input type="hidden" name="option_selectX" value="B">, and <input type="hidden" name="option_amountX" value="C"> must (1) not contain any capitals, special characters or spaces, (2) it also must either be alphanumeric or contain at least one letter, and (3) be one whole phrase:
Accepted:
1plug
thisisananswer
5000b
Not accepted for me:
1
1 plug
5000
this is an answer
This is strange to me because the value of <option value="A"> could include spaces before I included <input type="hidden" name="option_selectX" value="B"> and <input type="hidden" name="option_amountX" value="C">.
Took me a little while of trial and error to figure this out.

If XHTML does not allow nested forms, then how/why does this validate? Is this code ok to use?

I'm working on a webpage that lists several rental reservations from a database. I think I may have built myself into a corner. I originally had each row end with 3 cells, each one containing a tiny form made of 2 or 3 hidden fields and a button to "edit", "return", or "cancel" the reservation.
Those worked fine, and were all valid because each entire form was within a single cell.
Now I need to add functionality to allow selecting multiple rows, and passing them to another page. So without thinking, I added a <form> that wrapped around the whole table, added a checkbox to each row, and a submit button at the bottom of the table.
After some research, I'm pretty sure nested forms are not allowed in XHTML. But the document still somehow validates with the W3C validator. I'm using XHTML 1.0 Transitional. Maybe because its not a <form> directly within another <form>, its a <form> within a <table> within a <form>? Is that allowed?
The form works as it is (it submits a few extra fields from the top row, but I can just ignore those if I have to).
I'm just afraid to implement this because I feel like there's no way this is correct. If anyone could clarify whether or not this is valid I would really appreciate it. And if it's not, do you have any suggestions to fix it?
Thanks in advance!
<form id="form2" name="form2" method="post" action="pickup.php">
<table width="1200" border="1" align="center" cellpadding="5" cellspacing="0" style="border-collapse:collapse; border-color:#CCC;">
<tr>
<td colspan="10" bgcolor="#CCCCCC"><h2>Equipment Being Picked Up Today</h2></td>
</tr>
<tr class="highlight">
<td><input type="checkbox" name="res1" id="res1" value="2278" /></td>
<td>George Washington</td>
<td>555-333-4444</td>
<td>Lghting kit 6209</td>
<td>2/12/15</td>
<td>2/13/15</td>
<td></td>
<td align="center">
<form name="editForm" method="post" action="edit.php">
<input name="editFrom" type="hidden" value="today2.php" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input name="reservationID" type="hidden" value="2278" />
<input type="submit" name="edit" value="edit" />
</form>
</td>
<td align="center">
<form name="returnForm" method="post" action="today2.php">
<input name="reservationID" type="hidden" value="2278" />
<input name="return" type="hidden" value="yes" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input type="submit" value="return" />
</form>
</td>
<td align="center">
<form name="cancelForm" method="post" action="cancel.php">
<input name="editFrom" type="hidden" value="today2.php" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input name="reservationID" type="hidden" value="2278" />
<input type="submit" name="cancel" value="cancel" />
</form>
</td>
</tr>
<tr class="highlight">
<td><input type="checkbox" name="res2" id="res2" value="2279" /></td>
<td>Sam Adams</td>
<td>333-222-7777</td>
<td>camera kit 3456</td>
<td>2/12/15</td>
<td>2/13/15</td>
<td></td>
<td align="center">
<form name="editForm" method="post" action="edit.php">
<input name="editFrom" type="hidden" value="today2.php" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input name="reservationID" type="hidden" value="2279" />
<input type="submit" name="edit" value="edit" />
</form>
</td>
<td align="center">
<form name="returnForm" method="post" action="today2.php">
<input name="reservationID" type="hidden" value="2279" />
<input name="return" type="hidden" value="yes" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input type="submit" value="return" />
</form>
</td>
<td align="center">
<form name="cancelForm" method="post" action="cancel.php">
<input name="editFrom" type="hidden" value="today2.php" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input name="reservationID" type="hidden" value="2279" />
<input type="submit" name="cancel" value="cancel" />
</form>
</td>
</tr>
<tr class="highlight">
<td><input type="checkbox" name="res3" id="res3" value="2280" /></td>
<td>Bob Dole</td>
<td>111-222-4444</td>
<td>Other item 6789</td>
<td>2/12/15</td>
<td>2/13/15</td>
<td></td>
<td align="center">
<form name="editForm" method="post" action="edit.php">
<input name="editFrom" type="hidden" value="today2.php" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input name="reservationID" type="hidden" value="2280" />
<input type="submit" name="edit" value="edit" />
</form>
</td>
<td align="center">
<form name="returnForm" method="post" action="today2.php">
<input name="reservationID" type="hidden" value="2280" />
<input name="return" type="hidden" value="yes" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input type="submit" value="return" />
</form>
</td>
<td align="center">
<form name="cancelForm" method="post" action="cancel.php">
<input name="editFrom" type="hidden" value="today2.php" />
<input name="theDate" type="hidden" value="2015-02-12" />
<input name="reservationID" type="hidden" value="2280" />
<input type="submit" name="cancel" value="cancel" />
</form>
</td>
</tr>
<tr>
<td colspan="10">
<input type="submit" name="submit" id="submit" value="Pickup Selected Equipment" />
</td>
</tr>
</table>
</form>
It validates because the formal validation of XHTML 1.0 is based on XML rules, and XML is a strongly simplified modification of SGML, which is what HTML 4.01 is nominally based on. Consequently, some features, such as nested forms, which are prohibited in all versions of HTML are not forbidden by the formal syntax of XHTML 1.0 described in a DTD based on XML. The specification says this as follows:
SGML gives the writer of a DTD the ability to exclude specific
elements from being contained within an element. Such prohibitions
(called "exclusions") are not possible in XML.
For example, the HTML 4 Strict DTD forbids the nesting of an 'a'
element within another 'a' element to any descendant depth. It is not
possible to spell out such prohibitions in XML. Even though these
prohibitions cannot be defined in the DTD, certain elements should not
be nested. A summary of such elements and the elements that should not
be nested in them is found in the normative Element Prohibitions.
And the Element Prohibitions says that a form element must not contain another form element.
It is not safe to nest forms. There is no specification of what should happen if you do that. For example, it is not specified whether the fields on an inner form should be included when an outer form is submitted.
Thus, you should consider restructuring the page so that form nesting is avoided. If you need help with this, consider posting a new question that specifies the desired functionality and shows your best attempt at restructuring.

PayPal form creation

I'm having some trouble with a form I'm trying to create in PayPal for a WordPress website. It's a form that allows for different types of registrations and quantities - both of these work. At the end, my client also wants an option to donate any amount - this is not working.
The code at the bottom is only adding the amount entered as a 'note' to paypal, not as an actual monetary value to the amount being paid. I've tried 'name="amount"' as well.
<table>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input name="business" type="hidden" value="EMAIL" />
<input name="cmd" type="hidden" value="_xclick" />
<input name="item_name" type="hidden" value="Camper Registration" />
<input name="currency_code" type="hidden" value="USD" />
<!-- Provide a dropdown menu option field with quantity. -->
<tr>
<td><input type="hidden" value="Quantity" />How Many Campers?</td>
<td><select name="quantity">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select></td></tr>
<!-- Provide a dropdown menu option field with prices. -->
<tr>
<td><input name="on1" type="hidden" value="Payment Type" />Payment Amount</td>
<td><select name="os1">
<option value="deposit">Nonrefundable Deposit $100</option>
<option value="Before1/1">(Before 1/1/15) $210</option>
<option value="Before4/1">(Before 4/1/15) $225</option>
<option value="After4/1">(After 4/1/15) $250</option>
</select></td></tr>
<!-- Specify the price that PayPal uses for each option. -->
<input name="option_index" type="hidden" value="1" />
<input name="option_select0" type="hidden" value="deposit" />
<input name="option_amount0" type="hidden" value="100" />
<input name="option_select1" type="hidden" value="Before1/1" />
<input name="option_amount1" type="hidden" value="210" />
<input name="option_select2" type="hidden" value="Before4/1" />
<input name="option_amount2" type="hidden" value="225" />
<input name="option_select3" type="hidden" value="After4/1" />
<input name="option_amount3" type="hidden" value="250" />
<!-- Provide place for other donations. -->
<tr>
<td>Other Amount:</td>
<input type="hidden" name="on0" value="Other Amount">
<td><input name="os0" type="text" value="0"></td></tr>
<!-- Provide place for notes. -->
<tr>
<td>Child's Name(s) and Comments:</td>
<input type="hidden" name="on3" value="Notes">
<td><textarea name="os3" rows="4" cols="50" wrap></textarea></td></tr>
</table>
<!-- Display the payment button. -->
<input alt="PayPal - The safer, easier way to pay online" name="submit" src="https://www.paypalobjects.com/en_US/i/btn/btn_paynow_LG.gif" type="image" />
<img src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" alt="" width="1" height="1" border="0" />
</form>
this is the code in question:
<tr>
<td>Other Amount:</td>
<input type="hidden" name="on0" value="Other Amount">
<td><input name="os0" type="text" value="0"></td></tr>

PayPal cannot process this transactio​n because

Hi I am creating a form where I want to pass the prices to paypal. I have copied one of the sauce examples but I just keep getting the above error. Does any one have any ideas?
PayPal cannot process this transactio​n because of a problem with the seller's website.
thanks in advance Mikemc.
code is below
<!-- Identify your business so that you can collect the payments. -->
<input type="hidden" name="business" value="my details">
<!-- Specify a Buy Now button. -->
<input type="hidden" name="cmd" value="_xclick">
<!-- Specify details about the item that buyers will purchase. -->
<input type="hidden" name="item_name" value="my Product">
<input type="hidden" name="currency_code" value="GBP">
<!-- Provide a dropdown menu option field with prices. -->
<input type="hidden" name="on0" value="test">test<br />
<select name="os0">
<option value="1page">1 page £40.00 GBP</option>
<option value="4page">4 page £100.00 GBP</option>
<option value="6page">6 page £130.00 GBP</option>
</select> <br />
<!-- Specify the price that PayPal uses for each option. -->
<input type="hidden" name="option_index" value="1">
<input type="hidden" name="option_select0" value="1page">
<input type="hidden" name="option_amount0" value="40">
<input type="hidden" name="option_select1" value="4page">
<input type="hidden" name="option_amount1" value="100">
<input type="hidden" name="option_select2" value="6page">
<input type="hidden" name="option_amount2" value="130">
<!-- Display the payment button. -->
<br>
<input type="image" name="submit" border="0"
src="https://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif"
alt="PayPal - The safer, easier way to pay online">
<img alt="" border="0" width="1" height="1"
src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" >
</form>

Quantity value on initial page with web standard

I have very simple Entry Order page with dropdown choice depending on age and the Pay Now button.
Rather than change the quantity on the PayPal Page, I would like to show a Quantity TextBox (with a default value of 1) below the DropDown and pass the value then to the PayPal Page.
Here is my html:
<body style="border-style:double; text-align:center;">
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" runat="server">
<div><br />
<input type="hidden" name="cmd" value="_s-xclick"/>
<input type="hidden" name="hosted_button_id" value="WTFZKTFE95PDG"/>
<table align="center">
<tr><td><input type="hidden" name="on0" value="Registration Fees"/><b>Registration Fees</b></td></tr><tr><td><select name="os0">
<option value="14 Years and over">14 Years and over £20.00 GBP</option>
<option value="under 14 Years">under 14 Years £15.00 GBP</option>
</select> </td></tr>
</table><br /><br />
<input type="hidden" name="currency_code" value="GBP"/>
<input type="image" src="https://www.paypalobjects.com/en_US/GB/i/btn/btn_buynowCC_LG.gif" 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"/>
</div>
</form>
</body>
The variable that you would want to use to pass over the quantity, would be "quantity". So you could just add a line of code similar to that below.
Quantity: <input type="text" name="quantity" maxlength="5" value="1">