I want to use pay by creditcard but I haven't any progress in my task.
this is my code that I try but nothing happen.
<html>
<head>
<script type="text/javascript">
function onVisaCheckoutReady(){
V.init( {
apikey: "7O07VN664O10JW6A9ESS113p8sf9JeGzr6_2haC9F9m_ANtLM",
paymentRequest:{
currencyCode: "USD",
total: "10.00"
}
});
V.on("payment.success", function(payment) {
alert(JSON.stringify(payment));
});
V.on("payment.cancel", function(payment) {
alert(JSON.stringify(payment));
});
V.on("payment.error", function(payment, error) {
alert(JSON.stringify(error));
});
}
</script>
</head>
<body>
<img alt="Visa Checkout" class="v-button" role="button"
src="https://sandbox.secure.checkout.visa.com/wallet-services-web/xo/button.png"/>
<script type="text/javascript"
src="https://sandbox-assets.secure.checkout.visa.com/checkout-widget/resources/js/integration/v1/sdk.js">
</script>
</body>
</html>
any one can help me ?
and also I get some code from Visa official site but can't understand to use that.
You can simply sue stripe-php library to configure any type of credit Card that you want it is so easy and very responsive by each gateway payment service.
Related
I am using this code to display a div only for clients from United Kingdom and it works through built-in page builder - prestashop.
Unfortunately I cannot make it work in tpl file for address form.
Basically I need a text below the address form.
<div class="hide GB">text</div>
<script type="text/javascript">
{literal}
$.get("https://freegeoip.app/json/", function (response) {
document.getElementsByClassName(response.country_code)[0].style.display = "block";
}, "jsonp");
{/literal}
</script>
I also tried this one:
{literal}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>$.ajax("https://freegeoip.app/json/")
.done(function (e) {
$('.hide').eq(e.country_code === 'GB' ? 0 : 1).show();
});</script>
<div class="hide">text</div>
<div id="country_code"></div>
{/literal}
They both work in the fiddle. They both work in the page builder when added as raw html (without literal tags ofc)
However I cannot make them to work in adrress-form.tpl file for some reason. The text just wont show. However the country code is being displayed where I want it. It is just the text that wont.
Any ideas?
Regards
{literal}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<div id="GB">text</div>
<script>$.get("https://freegeoip.app/json/", function (response) {
$("#country_code").html(response.country_code);
if(response.country_code=='GB'){
document.getElementById(response.country_code).style.display = "block";
}
}, "jsonp");</script>
{/literal}
I actually solved this with this code.
CSS wise:
#GB{display:none;}
The code below is a simple abstraction of what I want to do - it deals with publish and subscribe of the dojo event model. My aim is to publish an event, and subscribe a method to that event.
<html>
<head>
<script>
dojoConfig={async:true, parseOnLoad: true}
</script>
<script type="text/javascript" src="dojo/dojo.js">
</script>
<script language="javascript" type="text/javascript">
require(["dojo/topic","dojo/domReady!"],
function(topic){
function somethod() {
alert("hello;");
}
try{
topic.publish("myEvent");
}
catch(e){
alert("error"+e);
}
//topic.publish("myEvent");
try{
topic.subscribe("myEvent", somethod);
}catch(e){alert("error in subscribe"+e);}
});
</script>
</head>
<body></body>
</html>
I get no alerts, not even in try and catch blocks. Developer console also shows no errors. Is this the correct way to handle publish and subscribe?
You're very close but have made one little mistake. You're subscribing to the topic after you're publishing to it, so you're not catching it. If you put the pub after the sub it'll work.
Here's your sample with slight modifications and comments:
<html>
<head>
<script>
dojoConfig={async:true, parseOnLoad: true}
</script>
<!-- I used the CDN for testing, but your local copy should work, too -->
<script data-dojo-config="async: 1"
src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js">
</script>
<script language="javascript" type="text/javascript">
require(["dojo/topic","dojo/domReady!"],
function(topic){
function somethod() {
alert("hello;");
}
try{
topic.publish("myEvent");
/* ignored because no one is subscribed yet */
}
catch(e){
alert("error"+e);
}
try{
topic.subscribe("myEvent", somethod);
/* now we're subscribed */
topic.publish("myEvent");
/* this one gets through because the subscription is now active*/
}catch(e){
alert("error in subscribe"+e);
}
});
</script>
</head>
<body></body>
</html>
I tried using Mention.js from this.
My Search.html contains,
<!DOCTYPE html>
<html>
<body>
<div>
<textarea id="try"></textarea>
</div>
<script type="text/javascript" src="http://jakiestfu.github.io/Mention.js/javascripts/bootstrap-typeahead.js">
$('#try').mention({
delimiter: '#',
users: [{
username: "ashley"
}, {
username: "roger"
}, {
username: "frecklefart123"
}]
});
</script>
</body>
</html>
The box returns no result. Any help in pointing my mistake is appreciated. Thanks.
P.S This is pseudocode, the actual usage is in my rails app in search.html.erb which has Typeahead dependancy.
As the documentation of Mention.js
Dependencies
jQuery ,
Typeahead
so you should use
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="http://jakiestfu.github.io/Mention.js/javascripts/bootstrap-typeahead.js"></script>
then the plugin
<script type="text/javascript">(function(e){e.fn.extend({mention:function(t){this.opts={users:[],delimiter:"#",sensitive:true,queryBy:["name","username"],typeaheadOpts:{}};var n=e.extend({},this.opts,t),r=function(){if(typeof e=="undefined"){throw new Error("jQuery is Required")}else{if(typeof e.fn.typeahead=="undefined"){throw new Error("Typeahead is Required")}}return true},i=function(e,t){var r;for(r=t;r>=0;r--){if(e[r]==n.delimiter){break}}return e.substring(r,t)},s=function(e){var t;for(t in n.queryBy){if(e[n.queryBy[t]]){var r=e[n.queryBy[t]].toLowerCase(),i=this.query.toLowerCase().match(new RegExp(n.delimiter+"\\w+","g")),s;if(!!i){for(s=0;s<i.length;s++){var o=i[s].substring(1).toLowerCase(),u=new RegExp(n.delimiter+r,"g"),a=this.query.toLowerCase().match(u);if(r.indexOf(o)!=-1&&a===null){return true}}}}}},o=function(e){var t=this.query,r=this.$element[0].selectionStart,i;for(i=r;i>=0;i--){if(t[i]==n.delimiter){break}}var s=t.substring(i,r),o=t.substring(0,i),u=t.substring(r),t=o+n.delimiter+e+u;this.tempQuery=t;return t},u=function(e){if(e.length&&n.sensitive){var t=i(this.query,this.$element[0].selectionStart).substring(1),r,s=e.length,o={highest:[],high:[],med:[],low:[]},u=[];if(t.length==1){for(r=0;r<s;r++){var a=e[r];if(a.username[0]==t){o.highest.push(a)}else if(a.username[0].toLowerCase()==t.toLowerCase()){o.high.push(a)}else if(a.username.indexOf(t)!=-1){o.med.push(a)}else{o.low.push(a)}}for(r in o){var f;for(f in o[r]){u.push(o[r][f])}}return u}}return e},a=function(t){var r=this;t=e(t).map(function(t,i){t=e(r.options.item).attr("data-value",i.username);var s=e("<div />");if(i.image){s.append('<img class="mention_image" src="'+i.image+'">')}if(i.name){s.append('<b class="mention_name">'+i.name+"</b>")}if(i.username){s.append('<span class="mention_username"> '+n.delimiter+i.username+"</span>")}t.find("a").html(r.highlighter(s.html()));return t[0]});t.first().addClass("active");this.$menu.html(t);return this};e.fn.typeahead.Constructor.prototype.render=a;return this.each(function(){var t=e(this);if(r()){t.typeahead(e.extend({source:n.users,matcher:s,updater:o,sorter:u},n.typeaheadOpts))}})}})})(jQuery)</script>
or just download the Mention.js file and link it to your code
and then
<script>
// run your code here
</script>
$('#try').mention({...)};it should be in $( document ).ready().
I'm just starting using Qunit and would like to know whether is there a way to capture/verify/omit alerts, For example:
function to_test() {
alert("I'm displaying an alert");
return 42;
}
and then have something like:
test("to_test", function() {
//in this case I'd like to test the alert.
alerts("I'm displaying an alert", to_test(), "to_test() should display an alert");
equals(42, to_test(), "to_test() should return 42" ); // in this case I'd like to omit the alert
});
I'm open to the suggestion of using another unit testing tool as well.
Thanks in advance!
Alright, looks like Sinon.JS is what you are looking for. I've never used it before, but I did to answer your question.
You can replace the global function alert (which is actually window.alert) with a temporary function that will record the message that would have been displayed.
It's easy to do in javascript (window.alert = function(msg) { savedMsg = msg; }). So you could do that within your test.
The complexity comes only from cleaning up after you've run your test. That's where you need Sinon.JS which can integrate with QUnit. You'll need this integration script.
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/qunit/git/qunit.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://code.jquery.com/qunit/git/qunit.js"></script>
<script type="text/javascript" src="sinon-1.1.1.js"></script>
<script type="text/javascript" src="sinon-qunit-0.8.0.js"></script>
<script>
function to_test() {
window.alert("I'm displaying an alert");
return 42;
}
$(document).ready(function(){
module("Module A");
test("first skip alert test ", function() {
var stub = this.stub(window, "alert", function(msg) { return false; } );
equals(42, to_test(), "to_test() should return 42" );
equals(1, stub.callCount, "to_test() should have invoked alert one time");
equals("I'm displaying an alert",stub.getCall(0).args[0], "to_test() should have displayed an alert" );
});
});
</script>
</head>
<body>
<h1 id="qunit-header">QUnit example</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture">test markup, will be hidden</div>
</body>
</html>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="js/jquery-1.3.2-vsdoc.js"></script>
<script type="text/javascript">
$(function() {
$("#Button1").click(function() {
$.getJSON("ticketPriceInArray.js",
function(json) {
var ticketPriceArray=[json.tickets[0].price, json.tickets[1].price,
json.tickets[2].price, json.tickets[3].price, json.tickets[4].price,
json.tickets[5].price];
alert(json.tickets[0].type);
var inputWord =$("#keyword").val();
if (inputWord=="A"){$("#result").text(ticketPriceArray[0]);}
if (inputWord=="B"){$("#result").text(ticketPriceArray[1]);}
if (inputWord=="C"){$("#result").text(ticketPriceArray[2]);}
if (inputWord=="D"){$("#result").text(ticketPriceArray[3]);}
if (inputWord=="E"){$("#result").text(ticketPriceArray[4]);}
if (inputWord=="F"){$("#result").text(ticketPriceArray[5]);}
});
});
});
</script>
Here is "ticketPriceInArray.js"
{
"tickets":[
{
"type":"A Ticket",
"price":220,
},
{
"type":"B Ticket",
"price":180,
},
{
"type":"C Ticket",
"price":120,
},
{
"type":"D Ticket",
"price":100,
},
{
"type":"E Ticket",
"price":80,
},
{
"type":"F Ticket",
"price":50,
}
]
}
This is a simple html where when the corresponding text inputed, the corresponding ticket price will show in the html after a button-click. All the ticket info is stored in a .json file named "ticketPriceInArray.js" and I have been trying to read it using $.getJSON(), but unfortunately I haven't been able to get any success. The weird thing is I didn't get any warning on anything so I couldn't fix it. Please see if you can give me any suggestions. Thank you.
By adding an AJAX error handler, I received this
"parsererror" SyntaxError: Unexpected token }
The problem is the trailing commas after each price property.
The following example is working fine in FF and Chrome with the exact JSON you provided. In IE you will have to remove the commas after the prices, as Phil already said.
In my test both the test.html and test.js were placed in my apache server root; viewing the files directly from my desktop into my browser didn't work apparently due to security restrictions.
<html>
<head></head>
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
</script>
<script type="text/javascript">
$(function() {
$("#Button1").click(function() {
$.getJSON("test.js", function(json) {
for (var i in json.tickets) {
var type = json.tickets[i].type;
var price = json.tickets[i].price;
$('#result').append('<span>type: ' + type+ ', price: ' + price + '</span><br />');
}
});
});
});
</script>
<button id="Button1">click me</button>
<div id="result"></div>
</body>
</html>
I suggest you use http://jsonlint.com/ to validate your JSONs; or just rely on a good encoder instead of doing it by hand ;)
A little bit different approach to solving this problem. This is assuming that you aren't changing your ticket prices based on some data that you pass to the url.
ticketPriceInArray.js
{
"A" : 220,
"B" : 180,
"C" : 120,
"D" : 100,
"E" : 80,
"F" : 50
};
main file
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="js/jquery-1.3.2-vsdoc.js"></script>
<script type="text/javascript">
var ticket_prices = {};
$(function() {
$("#Button1").click(function() {
$.getJSON("ticketPriceInArray.js", function(returnedJSON) {
ticket_prices = returnedJSON;
$("#result").text( ticket_prices[ $("#keyword").val() ] );
});
});
});
</script>
If there are any considerations (or questions about my assumptions) let me know and I will update based on that.
Assuming the following facts:
you're using firefox
there is no traffic in the network-tab when you click on #Button1
there are no errors logged
... I would like to say:
the element you click on is not $("#Button1")
Are you sure that the element you click on has the ID "Button1" and that there is only one element using that ID ?
Are you running this from a webserver or from your local filesystem?