I have this code in my JS
var customer = {
name: "John Jack",
speak: function(){
return "my name is "+name;
},
address:{
street: '123 main st',
city: 'Pittsburgh',
state: 'PA'
}
}
document.write(customer.speak());
In my HTML i expected
my name is John Jack
But instead i got something really weird
my name is Peaks mirroring in a lake below, Stubai Alps, Austria
I have some theories that this is somehow connected to the Chrome extension i'm using called "Pixlr",but i don't see how my js code could connect to that.I tried changing variable name and speak to say,but it still prints the same thing.What's wrong?
replace name with this.name
var customer = {
name: "John Jack",
speak: function() {
return "my name is " + this.name;
},
address: {
street: '123 main st',
city: 'Pittsburgh',
state: 'PA'
}
}
document.write(customer.speak());
Related
I have a mustache file, and I am iterating over the array:
var data = {
sales: [
{
name: "Jim Frost",
region: "USA East",
phone: "212-555-1212",
email: "jfrost#acme-travel.com"
},
{
name: "Jan Smith",
region: "USA West",
phone: "310-555-1212",
},
{
name: "Fred Wesley",
phone: "608-555-1212",
email: "fwesley#acme-travel.com"
},
{
name: "Lisa Moore",
region: "USA South",
phone: "315-555-1212",
email: "lmoore#acme-travel.com"
},
{
name: "Jim Dio",
phone: "+ 44 022-555-1212",
email: "jdio#acme-travel.com"
},
{
name: "Charles Watts",
region: "Spain",
email: "cwatts#acme-travel.com"
},
{
name: "Bert Cooper",
region: "Italy",
email: "bcooper#acme-travel.com"
}
]
};
here is the markup:
<div>
<section>
{{#data.sales}}
<article class="items">
<div class="region">{{{region}}}</div>
</article>
{{/data.sales}}
</section>
</div>
I want to add some special style (like, bold font, color etc) ONLY if the region is USA East.
how can i detect inside this inherent loop in the article element if {{{region}} has a specific value? Given that the comparison will be made against a value that i get from backend, say {{myValue}}, which is manually set to USA East in the backend.
You can add a function in the data which will return the correct class depending on the region value. Something like
data['regionClass'] = function(){
if ( this['region'] == 'USA East' ) {
return "strong green";
}else{
return "";
}
}
And then in the Mustache you can do: <div class="region {{regionClass}}">{{{region}}}</div>
In my app Im trying perform a search filter on names by partial match from the beginning. Heres an example of what Im trying to do:
Lets say I have a list of names:
Ben
James
Adam
Judy
Andy
and enter the text "a" in my search field, it would return
Adam
Andy
if I further enter "an" in my search field, it would return
Andy
In my app.js, I have the code:
var myApp = angular.module("myApp", []);
myApp.controller("myController", function ($scope) {
var employees = [
{ name: "Ben", gender: "Male", salary: 55000, city: "London" },
{ name: "Jane", gender: "Female", salary: 62000, city: "Albany" },
{ name: "Rick", gender: "Male", salary: 65000, city: "Los Angeles" },
{ name: "Pam", gender: "Female", salary: 60000, city: "Paris" },
{ name: "Josh", gender: "Male", salary: 68000, city: "Brussels" },
];
$scope.employees = employees;
$scope.filtered = function (item) {
if ($scope.searchName == undefined) {
return true;
} else {
if (item.name.toLowerCase().startsWith($scope.searchName.toLowerCase()) != -1) {
return true;
}
}
return false;
}
});
And in my html page, I have the following line which displays the list of employees:
<tr ng-repeat="employee in employees | filter: filtered">
And the following line which the user inputs the search text:
<input type="text" placeholder="Search Name" ng-model="searchName.name"> <br><br>
However, when I attempt to test this, I get the error:
Error: $scope.searchName.toLowerCase is not a function. (In '$scope.searchName.toLowerCase()', '$scope.searchName.toLowerCase' is undefined)
As your ng-model is set to searchName.name, $scope.searchNameis an object, therefore it has no .toLowerCase() function.
You need to adjust your if-case like this:
if (item.name.toLowerCase().startsWith($scope.searchName.name.toLowerCase()) !== -1) {}
Furthermore, it is advisable to use identity operators instead of equality operators, unless strict identity is explicitly not needed.
The ng-model is set to searchName.name, so you may need to call on $scope.searchName.name.toLowerCase() instead of $scope.searchName.toLowerCase()
Using the Moltin Javascript SDK and able to retrieve products and add them to my cart. However when I try to checkout the cart and process a payment I get a 406 Not acceptable returned.
This I have stripped out all my two way binding and used the code snippet from Moltin's site but still not result.
Link to the entire project as well https://github.com/humbm0/ecommerce-site.
Thanks in advance!
angular.module('ecommerceSite2App')
.controller('CheckoutCtrl', function ($scope, checkout, moltin) {
$scope.items = checkout.cart.contents;
$scope.createOrder = function() {
var order = moltin.Cart.Complete({
gateway: 'dummy',
customer: {
first_name: 'Jon',
last_name: 'Doe',
email: 'jon.doe#gmail.com'
},
bill_to: {
first_name: 'Jon',
last_name: 'Doe',
address_1: '123 Sunny Street',
address_2: 'Sunnycreek',
city: 'Sunnyvale',
county: 'California',
country: 'US',
postcode: 'CA94040',
phone: '6507123124'
},
ship_to: 'bill_to',
shipping: '1305214549095350548'
});
console.log(order);
var checkout = moltin.Checkout.Payment('purchase', order.id, {
data: {
number: '4242424242424242',
expiry_month: '02',
expiry_year: '2017',
cvv: '123'
}
});
Have you checked that you have enabled the dummy gateway from the forge dashboard? - https://forge.moltin.com/gateway
The second thing, instead of using the shipping method ID could you try using the shipping method slug instead?
If you need more help you can also request an invite to join our community slack channel where you can speak to other users and the rest of the moltin team. https://moltin.com/community
could anyone help me with this please, used Canada as example:
var CA = {
name: "Canada Name",
iso: "CA",
percentage: "23.4",
color: getColor(23.4)
};
$(function() {
$('#world-map').vectorMap({
map: 'world_mill_en',
.
.
onRegionTipShow: function(event, wrap, code) {
wrap.html('hello ' + code); // working, outputs "hello CA"
console.log(CA.name); // working, outputs "Canada Name"
console.log(code.name); // not working - undefined
},
.
.
How can I use the "code" to refer to the variable (CA in this case)?
As I see code outputs a string but I just can not turn it to a form that works
Thx
You would need to further wrap your CA object in another object, something like this:
var langs = {
CA: {
name: "Canada Name",
iso: "CA",
percentage: "23.4",
color: getColor(23.4)
}
}
You can then access the properties of langs using bracket notation. So assuming code = 'CA' in your example:
onRegionTipShow: function(event, wrap, code){
wrap.html('hello ' + code); // = 'hello CA'
console.log(langs[code].name); // = 'Canada Name'
},
http://net.tutsplus.com/tutorials/javascript-ajax/into-the-ring-with-knockout-js/
I've worked to Round 2 – Creating a View, using the code as published on the site, I'm returned an error by FF FB 1.7.3
Error: missing ) in parenthetical
Source File: http://testing:8888/knockout/js/behavior.js
Line: 7, Column: 3
Source Code:
}; ko.applyBindings(viewModel);
Behavior
(function ($) { var model = [{ name: "John", address: "1, a road, a town, a county, a postcode", tel: "1234567890", site: "www.aurl.com", pic: "/i/john.jpg", deleteMe: function () { viewModel.people.remove(this); }
}, { name: "Jane", address: "2, a street, a city, a county, a postcode", tel: "1234567890", site: "www.aurl.com", pic: "/i/jane.jpg", deleteMe: function () { viewModel.people.remove(this); }
}, { name: "Fred", address: "3, an avenue, a village, a county, a postcode", tel: "1234567890", site: "www.aurl.com", pic: "/i/fred.jpg", deleteMe: function () { viewModel.people.remove(this); }
}, { name: "Freda", address: "4, a street, a suburb, a county, a postcode", tel: "1234567890", site: "www.aurl.com", pic: "/i/jane.jpg", deleteMe: function () { viewModel.people.remove(this); }
}], viewModel = { people: ko.observableArray(model),
} }; ko.applyBindings(viewModel); })(jQuery);
The code on the tutorial is flawed. The behaviors.js code has an additional bracket between viewModel and ko.applyBindings. It looks like this:
viewModel = { people: ko.observableArray(model),
} }; ko.applyBindings...
It needs to look like this:
viewModel = { people: ko.observableArray(model),
}; ko.applyBindings...
I didn't like several things about this sample. Here is my version, slightly modified:
(function ($) {
var model, viewModel;
model = [
{
name:"John",
address:"1, a road, a town, a county, a postcode",
tel:"1234567890",
site:"www.aurl.com",
pic:"/img/john.jpg",
deleteMe:function () {
viewModel.people.remove(this);
}
},
{
name:"Jane",
address:"2, a street, a city, a county, a postcode",
tel:"1234567890",
site:"www.aurl.com",
pic:"/img/jane.jpg",
deleteMe:function () {
viewModel.people.remove(this);
}
},
{
name:"Fred",
address:"3, an avenue, a village, a county, a postcode",
tel:"1234567890",
site:"www.aurl.com",
pic:"/img/fred.jpg",
deleteMe:function () {
viewModel.people.remove(this);
}
},
{
name:"Freda",
address:"4, a street, a suburb, a county, a postcode",
tel:"1234567890",
site:"www.aurl.com",
pic:"/img/jane.jpg",
deleteMe:function () {
viewModel.people.remove(this);
}
}
];
viewModel = {
people: ko.observableArray(model)
} ;
ko.applyBindings(viewModel);
})(jQuery);