List.FeaturedItem = Marionette.ItemView.extend({
template: "#featuredItem-template",
tagName: "li",
attributes: function () {
var attribs = {};
attribs = {class: this.model.escape("id").toLowerCase() + " featuredImage"};
return attribs;
}
});
Why does the above code fail in ie8? It works fine everywhere else. It says "expected indentifier, string or number is missing" and drops the cursor in the middle of the world "class" from the above bit of code.
BTW, I am trying to create a backbone.js/marionette.js application. I dropped back to jquery 1.9.1 since that is the bestie8 can handle. This works beautifully everywhere but ie8 and unfortunately that is a requirement for this application.
The correct solution for this little bit of code really is to put quotes around the word "class". As silly as that is, ie8 does seem to require it. thank you rayweb_on.
Related
Could anybody help me calling a validation function in can.js?
I'm adding can.jquery.js and can.map.validations.js
and then create such a small example:
var mymap = can.Map.extend({
init: function () {
this.validatePresenceOf('myfield'); // this line reports an error
}
});
when loading page with this script, I get an error in browser:
"Uncaught TypeError: undefined is not a function"
Actually any this.validate* function does not work
After some research I notice that when I put this code under
$(document).ready{}
it works, but if I put it into .js file and load via tag - browser reports an error.
And I'm not going to write all of my js code in the page itself
see here it tells pretty clearly(helped me last time) that you have to use $document.ready() or else it wont work, so try making a new file.js, have $document.ready() contain all your todo-code, and link it up, I hope I am helpful in this regard, if not then bug me up I wont mind at all :) ..
Commenting it late but anyway - it didn't work for me in either case so I just took the sample from http://jsbin.com/jofeq/5/edit?html,js,output - and copied it to my code. Surprisingly it worked after copying - not sure what was wrong on my side.
In that example it looks like this:
var Person = can.Map({
init: function () {
this.validatePresenceOf('firstName');
this.validatePresenceOf('lastName');
}
}, {});
and it works without document.ready tricks or anything else - just included into body tag
I have asked this everywhere but still not getting any feedback and is getting me crazy. We are using some Alloy UI widgets on the portal im working with (Liferay 6.2) and everything works fine in all the browsers but IE8. For some reason im getting an error message regarding an invalid argument in one of the YUI core files functions regarding setStyle (what you use to add styles to a node in YUI). I have realized that IE8 is not happy with this (here's the whole YUI function) :
setStyle: function(node, att, val, style) {
style = style || node.style;
var CUSTOM_STYLES = Y_DOM.CUSTOM_STYLES;
if (style) {
if (val === null || val === '') { // normalize unsetting
val = '';
} else if (!isNaN(new Number(val)) && re_unit.test(att)) { // number values may need a unit
val += Y_DOM.DEFAULT_UNIT;
}
if (att in CUSTOM_STYLES) {
if (CUSTOM_STYLES[att].set) {
CUSTOM_STYLES[att].set(node, val, style);
return; // NOTE: return
} else if (typeof CUSTOM_STYLES[att] === 'string') {
att = CUSTOM_STYLES[att];
}
} else if (att === '') { // unset inline styles
att = 'cssText';
val = '';
}
style[att] = val;
What is causing IE8 to report the error is this line:
style[att] = val;
apparently because of
val =' ';
What i don't understand is why the other browsers don't have any problem with that declaration and just IE8 complains about it. Since this is part of the dom-style.js which is a core file for YUI in Liferay i really don't want to mess with that code. I will REALLY appreciate any help since i have been dealing with this for the whole week and still can't get a solution and / or information on the www about a similar issue.
Ok this is WAY more simple than i thought. For some reason all the modern browsers (including IE9) don't have any problems when you initialize Alloy UI with :
YUI({ lang: 'ca-ES' }).use(
'aui-node',
'aui-datatable',
'aui-pagination',
'datatype-date',
function(Y) {...
But IE8 (of course) will give you a series of really weird console errors and will make your widgets work bad if you dont use AUI insted of YUI, so that was it i replaced YUI by AUI in all the parts of my code and now is working fine in IE8 too. If somebody can give a proper explanation will be really appreciated since is hard for me to understand why IE8 is not ok with using YUI to initialize Alloy UI widgets or use YUI.
Im still doing some research on that but it seems that the reason this is happening is because im using YUI on a .JS file, still have to find a proper explanation tho.
I'm trying to rig up a Knockout binding for Fancybox (although I don't think that's too much involved here). I'm calling Fancybox based on the code from the sample here: http://jsfiddle.net/STgGM/
$.fancybox.open([{
href: value.image(),
title: value.title()
}], {
padding: 0
});
The object passed in looks like:
{href: "http://example.com/imageurl", title: "Image Title"}
Stepping through the fancybox code, it bails out of trying to show the image around line 855 of the script:
if (!type) {
F.coming = null;
//If we can not determine content type then drop silently or display next/prev item if looping through gallery
if (F.current && F.router && F.router !== 'jumpto') {
F.current.index = index;
return F[ F.router ]( F.direction );
}
return false;
}
I'm not entirely sure what it's looking for at this point. F.current is null and F.router doesn't exist on the object.
So, in short, I'm trying to trigger Fancybox from a link click, without modifying my markup that much, or calling .fancybox() on a particular element. This appears to be possible, but it doesn't appear to be working for me.
After digging through the code more, I eventually found the solution. Fancybox was trying to figure out what sort of content I was telling it to display by inspecting the URL I was giving it. As my URL had no extension, since it was coming from an external service that uses and ID to access an image, and not a full file name, Fancybox had no clue what I was telling it to display, and gave up.
The solution, since I know what the content is, is this:
$.fancybox.open({
href: value.image(),
title: value.title(),
type: 'image'
},//other stuff (not relevant to this)
This makes FancyBox work as expected.
My embed code to play Youtube video is:
<object height="356" width="425" type="application/x-shockwave-flash" id="myytplayer" data="http://www.youtube.com/v/MTf6qXn5Prw?enablejsapi=1&playerapiid=ytplayer&version=3"><param name="allowScriptAccess" value="always"></object>
I want to track Youtube player's events (play/pause/stop etc)
The following piece of code works independently
window.onYouTubePlayerReady = function(playerId){
ytplayer = document.getElementById("myytplayer");
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
}
window.onytplayerStateChange = function (newState) {
alert("Player's new state: " + newState);
}
I am using YUI.
When I put the same in
YUI.add('module-name', function(Y) {
[some other code...]
window.onYouTubePlayerReady = function(playerId){
// console.log(playerId); console.log(ytplayer);
ytplayer = document.getElementById("myytplayer");
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
}
window.onytplayerStateChange = function (newState) {
alert("Player's new state: " + newState);
}
},'3.4.0', {requires:'module-a', 'module-b'})
Function onytplayerStateChange works in Firefox and Safari but not in other browsers.
Then I tried YUI functions to make that working in all browsers so I did some changes
window.onYouTubePlayerReady = function(playerId){
var shinyPlayer = Y.one("#myytplayer");
shinyPlayer.on('onStateChange', function (e) {
e.preventDefault();
alert('here');
});
}
but it didn't work for me.
I don't want to place window.onytplayerStateChange outside of YUI.add('module-name', function(Y) {})
Please suggest what should I do to track Youtube player's states in all browsers.
Thanks in advance.
I made a jsFiddle to test this:
http://jsfiddle.net/2Mj6b/4/
For me it feels like addEventListener is a custom implementation of Google.
Normally the second parameter is a callback/function-pointer and no string.
If you attach a variable to the window object it gets global and is from every scope visible. So it's no problem if you define it in the YUI module.
The second problem is that you cant use the player as YUI object you have to stay on dom objects to get this work.
Oh this is a old question. Damn. But i will post this anyway. ;)
I'm writing an extension for firefox. Using dom.location to keep track of visited search results pages, i'm getting this url http://www.google.com/search?hl=en&source=hp&q=hi&aq=f&aqi=&oq=&fp=642c18fb4411ca2e . If you click it, the google search results for "hi" should come up. You'll know that from the title bar - because the rest of the page won't load. This happens with any google search. Oddly enough, if you cut part of it off, so say, http://www.google.com/search?hl=en&source=hp&q=hi - it works! But Googling "hi" myself does give me a longish URL - http://www.google.com/#hl=en&source=hp&q=hi&aq=f&aqi=&oq=&fp=db658cc5049dc510 . I know for a fact that the first time that URL was visited, the page loaded, I did it myself.
Can anyone make reason out of this?
I just tried my experiment again, this time saving the original URL in the location bar. It turns out, dom.location.href is giving a different value. How is this happening?
Original:
http://www.google.com/#hl=en&source=hp&q=hi&aq=f&aqi=&oq=&fp=642c18fb4411ca2e
dom.location.href
http://www.google.com/search?hl=en&source=hp&q=hi&aq=f&aqi=&oq=&fp=642c18fb4411ca2e
window.addEventListener("load", function() { myExtension.init(); }, false);
var myExtension = {
init: function() {
var appcontent = document.getElementById("appcontent"); // browser
if(appcontent)
appcontent.addEventListener("DOMContentLoaded", myExtension.onPageLoad, true);
var messagepane = document.getElementById("messagepane"); // mail
if(messagepane)
messagepane.addEventListener("load", function () { myExtension.onPageLoad(); }, true);
},
onPageLoad: function(aEvent) {
var doc = aEvent.originalTarget; // doc is document that triggered "onload" event
// do something with the loaded page.
// doc.location is a Location object (see below for a link).
// You can use it to make your code executed on certain pages only.
var url = doc.location.href;
if (url.match(/(?:p|q)(?:=)([^%]*)/)) {alert("MATCH" + url);resultsPages.push(url);} else {alert(url);
}
}
This snippet comes directly from Mozilla with the matching and alerts my own. I apologize for not posting the code earlier.
Well, on the "right" page http://www.google.com/#hl=en&source=hp&q=hi&aq=f&aqi=&oq=&fp=1&cad=b there seems to be a frame with the "wrong" location: frames[0].location == "http://www.google.com/search?hl=en&source=hp&q=hi&aq=f&aqi=&oq=&fp=1&cad=b". You're probably getting the inner frame's location. I have no idea why, since you didn't post any of your code and just mention some "dom.location", which I never heard of.