{"_id":"5632a5ec49e16d0d001224bf","__v":1,"category":{"_id":"5632a5e749e16d0d00122444","pages":["5632a5ec49e16d0d001224bd","5632a5ec49e16d0d001224be","5632a5ec49e16d0d001224bf","5632a5ec49e16d0d001224c0","5632a5ec49e16d0d001224c1","5632a5ec49e16d0d001224c2","5632a5ec49e16d0d001224c3","5632a5ec49e16d0d001224c4","5632a5ec49e16d0d001224c5","5632a5ec49e16d0d001224c6","5632a5ec49e16d0d001224c7","5632a5ec49e16d0d001224c8","5632a5ec49e16d0d001224c9","5632a5ec49e16d0d001224ca","5632a5ec49e16d0d001224cb","5633bab59c607719001b86a1","5633bcbac49a7c19001fd0a6","5633befcc49a7c19001fd0a9","5633c585b904a10d0032f864","5633d7547b56ae0d0025a062","5633d7e87b56ae0d0025a066","5633d85435355017003ca3c8","5633da507e9e880d00af1a28","5633daa3fa71f30d00ba74ab","5633e1f87e9e880d00af1a3f","5633e323fa71f30d00ba74b9","5633e3aa7b56ae0d0025a072","5633e4c6737ea01700ea3276"],"project":"55b933b3146ef121002158d3","version":"5632a5e549e16d0d00122443","__v":14,"sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-07-31T23:12:47.262Z","from_sync":false,"order":0,"slug":"epayment-form","title":"ePayment Form"},"version":{"_id":"5632a5e549e16d0d00122443","__v":6,"project":"55b933b3146ef121002158d3","createdAt":"2015-10-29T23:04:05.701Z","releaseDate":"2015-10-29T23:04:05.701Z","categories":["5632a5e749e16d0d00122444","5632a5e749e16d0d00122445","5632a5e749e16d0d00122446","5632a5e749e16d0d00122447","5632a5e749e16d0d00122448","5632a5e749e16d0d00122449","5632a5e749e16d0d0012244a","5632a5e749e16d0d0012244b","5632a5e749e16d0d0012244c","5632a5e749e16d0d0012244d","5632a5e749e16d0d0012244e","5632a5e749e16d0d0012244f","5632a5e749e16d0d00122450","5632b179df556c0d00cd095b","564e13053b2b4a19000cd69b","59caa9df65accc001a489c95","59cab50965accc001a489d28","59cadd464ab7b70024378e74"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.1.0","version":"1.1"},"githubsync":"","project":"55b933b3146ef121002158d3","user":"55b932ba8fd1a02b00f496c8","parentDoc":null,"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-07-31T23:14:25.776Z","link_external":false,"link_url":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":2,"body":"This example code shows how to add a basic drop-down menu (list) to the Epayment form and how to assign it to specific fields depending on the placement of the drop-down. It assumes no other changes have been made to the payment form.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Overview\"\n}\n[/block]\n* A drop-down can be added to any field in the form. It is important to always assign the drop-down menu to specific fields so that the transaction details will be transferred to the correct field.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"HTML\"\n}\n[/block]\n* The first step is to decide where you want to place the drop down menu in your form. In this example we will be using the amount field, also known as UMamount, within the form. (You can look up all the fields under the complete payment form documentation. [EpaymentForm](/docs/overview))\n\n* Find the field and the row attached to it within the form. Here is an example of what the **UMamount **row with the field looks like:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<tr>\\n               <td bgcolor=\\\"#F0F0F0\\\" width=\\\"234\\\" align=\\\"right\\\"><font size=\\\"2\\\" face=\\\"Verdana\\\">Order Amount:</font></td>\\n               <td bgcolor=\\\"#F0F0F0\\\" width=\\\"450\\\">[UMamount]\\n               </td>\\n       </tr>\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\n* Select the form code from <tr> to </tr> and replace it with the following HTML code:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<tr>                        \\n                   <td bgcolor=\\\"#F0F0F0\\\" width=\\\"234\\\" align=\\\"right\\\"><font size=\\\"2\\\" face=\\\"Verdana\\\"> Amount:</font></td>\\n               <td bgcolor=\\\"#F0F0F0\\\"  width=\\\"450\\\"><select name=\\\"UMamount\\\">\\n                     <option value=\\\"none\\\">Select One</option>\\n                     <option value=\\\"50.00\\\">$50</option>\\n                     <option value=\\\"100.00\\\">$100</option>\\n               </select>\\n               </td>\\n             </tr>    \",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\n* The example shows what the code for a drop-down with two options would look. You can add as many options as you need. All you will have to do is repeat this cell **<option value=””>………</option>**. You can change the wording of the first option value to whatever you want the drop-down to list; the example used here is “select one”.\n\n* The value of each option goes between the quotation marks like this: <option value=“this”>**this**</option>, and the names of each option your customers will see goes between the angle brackets like this: <option value=“this”>**this**</option>.\n\n* You can also add a drop-down menu that offers custom options to customers and then displays those options in a custom field in the transaction details. In the example shown above, this would mean changing UMamount to UMcustom1 and “Amount” to the name of your custom field.","excerpt":"Creating a Drop-Do","slug":"drop-down-menu","type":"basic","title":"Drop-Down Menu"}

Drop-Down Menu

Creating a Drop-Do

This example code shows how to add a basic drop-down menu (list) to the Epayment form and how to assign it to specific fields depending on the placement of the drop-down. It assumes no other changes have been made to the payment form. [block:api-header] { "type": "basic", "title": "Overview" } [/block] * A drop-down can be added to any field in the form. It is important to always assign the drop-down menu to specific fields so that the transaction details will be transferred to the correct field. [block:api-header] { "type": "basic", "title": "HTML" } [/block] * The first step is to decide where you want to place the drop down menu in your form. In this example we will be using the amount field, also known as UMamount, within the form. (You can look up all the fields under the complete payment form documentation. [EpaymentForm](/docs/overview)) * Find the field and the row attached to it within the form. Here is an example of what the **UMamount **row with the field looks like: [block:code] { "codes": [ { "code": "<tr>\n <td bgcolor=\"#F0F0F0\" width=\"234\" align=\"right\"><font size=\"2\" face=\"Verdana\">Order Amount:</font></td>\n <td bgcolor=\"#F0F0F0\" width=\"450\">[UMamount]\n </td>\n </tr>", "language": "html" } ] } [/block] * Select the form code from <tr> to </tr> and replace it with the following HTML code: [block:code] { "codes": [ { "code": "<tr> \n <td bgcolor=\"#F0F0F0\" width=\"234\" align=\"right\"><font size=\"2\" face=\"Verdana\"> Amount:</font></td>\n <td bgcolor=\"#F0F0F0\" width=\"450\"><select name=\"UMamount\">\n <option value=\"none\">Select One</option>\n <option value=\"50.00\">$50</option>\n <option value=\"100.00\">$100</option>\n </select>\n </td>\n </tr> ", "language": "html" } ] } [/block] * The example shows what the code for a drop-down with two options would look. You can add as many options as you need. All you will have to do is repeat this cell **<option value=””>………</option>**. You can change the wording of the first option value to whatever you want the drop-down to list; the example used here is “select one”. * The value of each option goes between the quotation marks like this: <option value=“this”>**this**</option>, and the names of each option your customers will see goes between the angle brackets like this: <option value=“this”>**this**</option>. * You can also add a drop-down menu that offers custom options to customers and then displays those options in a custom field in the transaction details. In the example shown above, this would mean changing UMamount to UMcustom1 and “Amount” to the name of your custom field.