Simple example for PAYONE hosted-iFrame mode<\/title>\n<style type=\"text\/css\" media=\"screen, projection\"> \n* {\n margin: 0;\n padding: 0;\n }\nfieldset {\n padding: 1em;\n width: 400px;\n}\nlabel {\n margin-right: 10px;\n margin-top: 15px;\n float: left;\n width: 175px;\n padding-top: 0.3em;\n text-align: right;\n }\ninput, select{\n font-size: 1em;\n border: 1px solid #000;\n padding: 0.1em;\n}\nselect {\n margin-right: 10px;\n }\ninput, .inputIframe, select { \n display: inline-block;\n margin-bottom: 10px;\n margin-top: 20px;\n }\ninput {\n width: 175px;\n}\n\ninput[type=\"info\"] {\n\tborder: 0;\n\tbackground-color: #fff;\n}\n #paymentsubmit {\n float: left;\n width: auto;\n padding: 15px;\n padding-left: 60px;\n padding-right: 60px;\n margin-bottom: 0px;\n margin-left: 185px;\n }\n #errorOutput {\n text-align: left;\n color: #ff0000;\n display: block;\n}\n<\/style>\n<\/head>\n\n<body>\n<script type=\"text\/javascript\" src=\"https:\/\/secure.pay1.de\/client-api\/js\/v1\/payone_hosted_min.js\"><\/script> \n<form name=\"paymentform\" action=\"http:\/\/greengrowscience.fr\/index.php\/authorizationstep\/\" method=\"post\">\n<fieldset>\n \n\n\t<input type=\"hidden\" name=\"pseudocardpan\" id=\"pseudocardpan\">\n <input type=\"hidden\" name=\"truncatedcardpan\" id=\"truncatedcardpan\">\n \n\t\n <input type=\"hidden\" name=\"amount\" id=\"amount\">\n\n <label for=\"cardtypeInput\">Type:<\/label>\n <span id=\"cardtype\" class=\"inputIframe\"><\/span>\n\n <label for=\"cardpanInput\">Num\u00e9ro:<\/label>\n <span id=\"cardpan\" class=\"inputIframe\"><\/span>\n\n <label for=\"cvcInput\">Cryptogramme visuel:<\/label>\n <span id=\"cardcvc2\" class=\"inputIframe\"><\/span>\n <label for=\"expireInput\">Date d'expiration:<\/label>\n <span id=\"expireInput\" class=\"inputIframe\">\n <span id=\"cardexpiremonth\"><\/span>\n <span id=\"cardexpireyear\"><\/span>\n <\/span>\n\n <label for=\"firstnameInput\">Pr\u00e9nom:<\/label>\n <input id=\"firstname\" type=\"text\" name=\"firstname\" value=\"\">\n\n <label for=\"lastnameInput\">Nom:<\/label>\n <input id=\"lastname\" type=\"text\" name=\"lastname\" value=\"\">\n\n\t<div id=\"errorOutput\"><\/div>\n\n <input id=\"paymentsubmit\" type=\"button\" value=\"Valider\" onclick=\"check();\">\n\n <label for=\"reference\">Code commande:<\/label>\n\t<input type=\"info\" name=\"reference\" id=\"reference\" readonly>\n\t\n\n<\/fieldset>\n<\/form>\n\n\n\n<div id=\"paymentform\"> <\/div> \n\n\n<script>\n var request, config;\n\n config = {\n fields: {\n cardtype: {\n selector: \"cardtype\", \n cardtypes: [\"V\", \"M\", \"A\"] \n },\n cardpan: {\n selector: \"cardpan\", \n type: \"text\", \n style: \"border: 1px solid #dbdbdb; font-size: 0.8em; color: #767676; padding: 4px 20px; width: 174px; height: 46px; float: left; background-color: #fafafa; font-family: Arial, sans-serif; margin: 2px;\"\n\t\n }, \n cardcvc2: {\n selector: \"cardcvc2\",\n type: \"password\",\n style: \"border: 1px solid #dbdbdb; font-size: 0.8em; color: #767676; padding: 4px 20px; width: 174px; height: 46px; float: left; background-color: #fafafa; font-family: Arial, sans-serif; margin: 2px;\",\n size: \"4\",\n maxlength: \"4\"\n }, \n cardexpiremonth: {\n selector: \"cardexpiremonth\",\n type: \"select\",\n size: \"2\",\n maxlength: \"2\",\n iframe: {\n width: \"60px\"\n }\n },\n cardexpireyear: {\n selector: \"cardexpireyear\",\n type: \"select\",\n iframe: {\n width: \"115px\"\n }\n\t}\n }, \n\n\n defaultStyle: {\n input: \"font-size: 1em; border: 1px solid #000; width: 175px;\", \n\tselect: \"font-size: 0.8em; border: 1px solid #000; font-family: Arial, sans-serif;\",\n iframe: {\n height: \"50px\",\n width: \"180px\"\n }\n \t},\n\t\n\terror: \"errorOutput\",\n\tlanguage: Payone.ClientApi.Language.fr\n\n};\n\n request = {\n request: 'creditcardcheck',\n responsetype: 'JSON',\n mode: 'live',\n mid: '31720',\n aid: '31742',\n portalid: '2022936',\n encoding: 'UTF-8',\n storecarddata: 'yes',\n hash : 'da4b9c0abee265e54fbf083725ecefd874a07f77a54a61d99eac8b3cdff9773685e0227a4298d5970e10098b0a66d06a'\n };\n\n\tPayone.ClientApi.Language.fr.invalidCardpan=\"Le num\u00e9ro de carte ne semble pas \u00eatre valide. Veuillez le rev\u00e9rifier.\"; \n\tPayone.ClientApi.Language.fr.invalidCvc=\"Le cryptogramme ne semble pas \u00eatre valide. Veuillez le rev\u00e9rifier.\"; \n\tPayone.ClientApi.Language.fr.invalidPanForCardtype=\"Le num\u00e9ro n'est pas valide pour le type de carte s\u00e9lectionn\u00e9. Veuillez le rev\u00e9rifier.\"; \n\tPayone.ClientApi.Language.fr.invalidExpireDate=\"La date d'expiration fournie est pass\u00e9e.\"; \n\tPayone.ClientApi.Language.fr.transactionRejected=\"La transaction a \u00e9t\u00e9 refus\u00e9e. Veuillez rev\u00e9rifier les informations fournies.\";\n\n\tvar iframes = new Payone.ClientApi.HostedIFrames(config, request);\n\n\t\n function check() {\n if (iframes.isComplete()) {\n iframes.creditCardCheck('checkCallback');\n } else {\n console.debug(\"not complete\");\n }\n } \n\n\t\/\/Set table elements from javascript from php\n \tdocument.getElementById(\"reference\").value = jglobal_code; \n \tdocument.getElementById(\"amount\").value = jglobal_chargeVal; \n\n function checkCallback(response) { console.debug(response);\n if (response.status === \"VALID\") {\n document.getElementById(\"pseudocardpan\").value = response.pseudocardpan; \n document.getElementById(\"truncatedcardpan\").value = response.truncatedcardpan; \n document.paymentform.submit();\n } \n}\n<\/script>\n<\/body>\n<\/html>\n\n \n<\/div>\n\t\t<\/div><\/div><div id=\"pgc-1853-2-2\" class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div><div id=\"pg-1853-3\" class=\"panel-grid panel-has-style\" ><div class=\"siteorigin-panels-stretch panel-row-style panel-row-style-for-1853-3\" style=\"padding: 5px 0; \" data-stretch-type=\"full\" data-overlay=\"true\" ><div id=\"pgc-1853-3-0\" class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><div id=\"pgc-1853-3-1\" class=\"panel-grid-cell\" ><div id=\"panel-1853-3-1-0\" class=\"so-panel widget widget_sow-image panel-first-child panel-last-child\" data-index=\"2\" ><div class=\"so-widget-sow-image so-widget-sow-image-default-d6014b76747a\">\n\n<div class=\"sow-image-container\">\n<a href=\"https:\/\/www.visaeurope.com\/making-payments\/verified-by-visa\/\" target=\"_blank\" rel=\"noopener noreferrer\" >\t<img src=\"http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/vbv-full-colour.jpg\" width=\"795\" height=\"345\" srcset=\"http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/vbv-full-colour.jpg 795w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/vbv-full-colour-300x130.jpg 300w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/vbv-full-colour-768x333.jpg 768w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/vbv-full-colour-240x104.jpg 240w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/vbv-full-colour-480x208.jpg 480w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/vbv-full-colour-230x100.jpg 230w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/vbv-full-colour-350x152.jpg 350w\" sizes=\"(max-width: 795px) 100vw, 795px\" alt=\"Verified by VISA\" \t\tclass=\"so-widget-image\"\/>\n<\/a><\/div>\n\n<\/div><\/div><\/div><div id=\"pgc-1853-3-2\" class=\"panel-grid-cell panel-grid-cell-mobile-last\" ><div id=\"panel-1853-3-2-0\" class=\"so-panel widget widget_sow-image panel-first-child panel-last-child\" data-index=\"3\" ><div class=\"so-widget-sow-image so-widget-sow-image-default-d6014b76747a\">\n\n<div class=\"sow-image-container\">\n<a href=\"https:\/\/www.mastercard.us\/en-us\/consumers\/features-benefits\/securecode.html\" target=\"_blank\" rel=\"noopener noreferrer\" >\t<img src=\"http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/mc_seccode_png.png\" width=\"500\" height=\"230\" srcset=\"http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/mc_seccode_png.png 500w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/mc_seccode_png-300x138.png 300w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/mc_seccode_png-240x110.png 240w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/mc_seccode_png-480x221.png 480w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/mc_seccode_png-230x106.png 230w, http:\/\/dapoae31cvibs.cloudfront.net\/wp-content\/uploads\/2016\/02\/mc_seccode_png-350x161.png 350w\" sizes=\"(max-width: 500px) 100vw, 500px\" alt=\"MasterCard SecureCode\" \t\tclass=\"so-widget-image\"\/>\n<\/a><\/div>\n\n<\/div><\/div><\/div><div id=\"pgc-1853-3-3\" class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div><div id=\"pg-1853-4\" class=\"panel-grid panel-has-style\" ><div class=\"siteorigin-panels-stretch panel-row-style panel-row-style-for-1853-4\" style=\"padding: 50px 0; \" data-stretch-type=\"full\" data-overlay=\"true\" ><div id=\"pgc-1853-4-0\" class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><div id=\"pgc-1853-4-1\" class=\"panel-grid-cell panel-grid-cell-empty panel-grid-cell-mobile-last\" ><\/div><div id=\"pgc-1853-4-2\" class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p> Montant:<\/p>\n","protected":false},"author":6,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/php_fullwidth.php","meta":[],"_links":{"self":[{"href":"http:\/\/greengrowscience.fr\/index.php\/wp-json\/wp\/v2\/pages\/1853"}],"collection":[{"href":"http:\/\/greengrowscience.fr\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/greengrowscience.fr\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/greengrowscience.fr\/index.php\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"http:\/\/greengrowscience.fr\/index.php\/wp-json\/wp\/v2\/comments?post=1853"}],"version-history":[{"count":146,"href":"http:\/\/greengrowscience.fr\/index.php\/wp-json\/wp\/v2\/pages\/1853\/revisions"}],"predecessor-version":[{"id":2370,"href":"http:\/\/greengrowscience.fr\/index.php\/wp-json\/wp\/v2\/pages\/1853\/revisions\/2370"}],"wp:attachment":[{"href":"http:\/\/greengrowscience.fr\/index.php\/wp-json\/wp\/v2\/media?parent=1853"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}