At V2 of fancybox, I could easily JS read an attribute ID of the clicked element for further use. It doesn't work with v3, I am wondering what's the problem, it was called at beforeShow
beforeShow: function() {
var tagid = this.element.attr('id');
alert(tagid);
}
Fancybox throws me an error as "undefined", meaning the click I have no idea what registers, but with v2 it was ok.
So basically passing any additional parameter through attributes that worked before, I can't read at beforeshow, or beforeload, or this is a different logic now at fancybox 3 so I have no idea...
Much appreciated!
Obviously, there is a reason why v3 is v3 and not v2, because these are ... well, different versions and you have to check docs on how to use new API. Therefore take a look at https://fancyapps.com/fancybox/3/docs/#events where you will find this snippet:
// Clicked element
console.info( slide.opts.$orig );
So, the ID of clicked element would be:
slide.opts.$orig.attr('id')
Related
I am using the latest API v2. While the other filters like min_price, category etc. are working, the attribute and attribute_terms query params are not filtering the result set.
I have an attribute Color and I am invoking the API from a node.js client as :
var WooCommerceAPI = require('woocommerce-api');
var WooCommerce = new WooCommerceAPI({
url: 'http://localhost/index.php',
consumerKey: '***',
consumerSecret: '***',
wpAPI: true,
version: 'wc/v2'
});
WooCommerce.getAsync('products?attribute=pa_color').then(function(result){
var data = JSON.parse(result.toJSON().body);
console.log(data);
});
How can I actually filter by attribute ? Tried other combinations e,g. attribute=Color , attribute=color. Still the result isn't filtered.
Have a look at the most recent WooCommerce REST API documentation: http://woocommerce.github.io/woocommerce-rest-api-docs/#list-all-products
WooCommerce seems to have a terrible history of REST APIs. They had API V1, V2 and V3 and then changed to WP REST API and created a V1 and V2. Of course searching on Google for a correct way to do it sucks badly.
This should be the correct way to do it:
https://example.com/wp-json/wc/v2/products/?attribute=pa_color&attribute_term=15
or
https://example.com/wp-json/wc/v2/products/?attribute=pa_color&attribute_term=green
Note: It is important to use attribute TOGETHER with attribute_term.
I guess the former way to do it was like this:
products?filter[meta_key]=pa_color&filter[meta_value]=green
or like this:
https://example.com/wp-json/wc/v2/products?attribute[pa_color]=green
but it seems like this does not work anymore in the WooCommerce WordPress API V2.
I have found the solution. The correct way to do it:
products?attribute=pa_color&attribute_term=50
You must replace the name of attribute terms with ID of attribute terms. Is working for me.
P.S. I'm using latest version of wc/v2.
I need to set s.campaign with a value that is returned by some ajax. I figured I could just make a direct call to get that done. Nothing seems to be reported.
After ajax I call:
_satellite.track('ruleString');
I can see in the debugger my rule is fired. In the Adobe analytics admin, has been set for values to expire after MIN.
I have tried four ways of getting the campaign value set from here.
1 -
Set it to a dataElement like : (in the analytics preset)
Campaign Value -> %mySpecialValue%
This element runs custom JS and logs the value so I know it runs, but adobe never sees a value.
2 -
I set it with the following: (in custom code box)
var delm = _satellite.getVar('special_id');
_satellite.setVar("newVal",delm);
return true;
and then set campaing to %%newVal%%
-
I set it with the following: (in custom code box)
var delm = _satellite.getVar('special_id');
s.linkTrackVars='campaign';
s.campaign = delm;
s.tl();
-
I set it with the following: (in custom code box)
var delm = _satellite.getVar('special_id');
s.linkTrackVars='eVar0';
s.campaign = delm;
s.tl();
None of them seem to get data passed to adobe analytics. It's like my campaign var doesn't accept data. It should also be noted that if I just set in DTM the value of campaign to just "text" it never seems to get passed in either.
Is there a better way to set campaign with custom code.
Please remember that AJAX is asynchronous:
$.ajax({
url: "test.html",
});
_satellite.track('ruleString');
is wrong, but:
$.ajax({
url: "test.html",
context: document.body
}).done(function() {
_satellite.track('ruleString');
});
will work.
Also please add in direct call rule console.log with data element value in javascript section, to check that value is present when rule is fired.
As it turns out a consutant that set up dtm initially for us dropped in some custom code in our app measurement file. It must have been from another client Basically s.campaign was being set in there only when "cmpid" was passed as a query param.
Basically (1) above is all thats needed in the direct call to set it from a data element so long as you call _satellite.track('stringVal'); when your ajax is done
If the data element value is coming from work done via Ajax, then don't call that data element with any other rules prior.
There's a collection Comments. Currently comments for the specfic Content are all published to the client.
Without pagination I can successfully render them in my template, insert new comments and enjoy the reactivity.
I'm fine at the moment with all comments sent to the client but I want to implement all-client-side pagination to visually simplify the page much like FB does.
Hare are the rules:
Comments are always sorted by the creation timestamp ASC (newer at the bottom of the list)
I need to show the total number of records in the collection (T)
I need to show the total number of comments currently displayed (C)
If there are more comments (C < T) I need to show a 'See more' link
Initially I show 5 newest comments (or all of them if there're less than 5)
New comments (pushed from the server) are instantly shown at the end of the list
When I click the 'See more' link up to 10 extra comments (the newest from the currently invisible -- and all of them are older that those already shown) are shown in the beginning of the list
So effectively it could be like:
have the minTime variable
initially set it to the timestamp of the 5th newest comment
when I click the link set it to the timestamp of the 10th newest comment older than the current value
template renders all the comments not older than this value
at some point calculate values C and T and save them
I tried to solve this with a bunch of Session variables but didn't succeed -- I think at some point getting and setting these vars from the template leads to recursion or what?
Additional problem is that I don't reliably know the 'initial' moment when I should calculate the minTime for the 1st time -- comments may still not be synched when the template is created or rendered for the first time.
So, the question: what is the proper way to fulfill my requirements?
Solution:
Meteor.startup(function(){
Session.set('number_of_visible_comments', 5);
});
Template.comments = function() {
return Comments.find({content: id_of_content}, {
sort: {timestamp: -1},
limit: Session.get('number_of_visible_comments')
});
};
Template.total_number_of_comments = function() {
return Comments.find({content: id_of_content}).count();
};
Template.number_of_visible_comments = function() {
return Session.get('number_of_visible_comments').count();
};
Template.comments.events({
'click': function() {
var count = Session.get('number_of_visible_comments') + 10;
Session.set('number_of_visible_comments', count);
}
});
In the meantime there are tow Meteor package for doing client-side pagination, one within a table. I admit I didn't go through all your requirements because of the comment exchange with ram1 above, but the package may help:
https://atmosphere.meteor.com/package/reactive-table
https://github.com/alethes/meteor-pages
I've been working my way through the KnockoutJS documentation and tried to modify example 3 of the "Writeable computed observables" section in this page.
The example basically shows a textbox and displays a message if the user enters a non-numeric value to the textbox. I tried to modify the code so that the textbox has a pink background when the message appears.
The problem is when you enter a invalid value the textbox turns pink as expected but the value you entered is replaced with what was originally there. I have no idea why this behavior is occurring since everything worked fine before I added the style binding to get the pink background. Try removing the style binding and notice how the behavior changes when you enter an invalid value.
What's going on?
The code is below or try out this jsfiddle.
<p>
Enter a numeric value:
<input data-bind="value: attemptedValue
,style: {backgroundColor: lastInputWasValid() ?
'transparent' :
'pink' }"/>
</p>
<div data-bind="visible: !lastInputWasValid()">That's not a number!</div>
function MyViewModel() {
this.acceptedNumericValue = ko.observable(123);
this.lastInputWasValid = ko.observable(true);
this.attemptedValue = ko.computed({
read: this.acceptedNumericValue,
write: function (value) {
if (isNaN(value))
this.lastInputWasValid(false);
else {
this.lastInputWasValid(true);
this.acceptedNumericValue(value); // Write to underlying storage
}
},
owner: this
});
}
ko.applyBindings(new MyViewModel());
EDIT: Here's another fiddle with the style binding removed. Try appending the letter 'a' and taking focus out of the textbox. Notice how the letter 'a' stays there. Try that with the original fiddle textbox and notice how it is removed. The only change between the two fiddles is the presence of the style binding.
If the value is NAN than it is never written to the model, therefore the input will be updated to the existing value of the model when the onblur event is fired.
this.acceptedNumericValue(value); // Write to underlying storage
Is the code that updates when the value is numerical. You can see that it is not in the else block.
So I sent an email to the KnockoutJS user group and got a reply in about 7 hours (not too shabby).
Sadly, Google Groups confuses me and I have no idea how to reply to the fellow who cleared up my question to tell him to come on over here and post his answer so I guess I'll do it for him. All credit goes to John Earles of the KO user group.
It make sense to me.
In your example without the style, Knockout does not have to re-render
your input (only the error), so the value stays the same.
In your example with the style, Knockout does have to re-render your
input (to add the style), so BOTH bindings execute and it reads the
value - which is the last accepted value.
Here is a version that saves the attempted value into one of two
observables, and reads from the appropriate one based on
lastInputWasValid:
http://jsfiddle.net/jearles/VSWfr/
I run a search using google.maps.places.PlacesService(map) and then I place markers on the map which is fine. I do this every time the "dragend" event occurs.
But then, every time, it added on the right side of the map "Listing by yellowpages". So if I scroll 3 times, I get 3 "Listing by yellowpages". How do I remove that?
I had a similar problem using the Google Maps API. Turns out it was caused by the fact I was creating a new PlacesService object every time, and when I switched to having just the single PlacesService object, this problem went away.
So make sure you only have once PlacesService object created and linked to the map.
Show last listing-by only
lib jquery
service = new google.maps.places.PlacesService(map);
service.textSearch(request, function(request, status){
if(status==google.maps.places.PlacesServiceStatus.OK){
$('.listing-by-map').hide();
$('#map div').last().addClass('listing-by-map');
//...
}
});