I have a bunch of divs like this:
<div class="bear"></div>
<div class="dog"></div>
How do I get a nodelist that includes all divs with class of bear and dog? I tried:
Y.get(".bear .dog").each(function() {
});
But it returns null. Anyone have any suggestions? Thanks!
Based on how CSS selectors work, it should be .bear, .dog
Along with VoteyDisciple's answer, you should change the get to all.
For example:
YUI().use('node',function(Y) {
console.log(Y.get(".bear, .dog").size()); // prints out 1
console.log(Y.all(".bear, .dog").size()); // prints out 2
});
YUI().use('node',function(Y) {
console.log(Y.get(".bear + .dog").size());
console.log(Y.all(".bear + .dog").size());
});
This could be done to select a node which has both bear and dog as classes.
Related
I'm making my table based on AJAX, it works fine, but now I want to add a column called "Operations", where I want to put buttons like 'edit', 'delete'.
How can I do this? I somehow can't find the answer in the docs, maybe I'm missing a word or something :)
OK, found an answer, if anyone's interested:
We add a column with a 'formatter', like this:
{ title:"Operations", field:"", formatter:operations }
And then e.g.:
function operations(cell, formatterParams, onRendered){
return `
<i class="fa fa-times" title = 'Delete' data-id = ${ cell.id}></i>
`;
}
I'm trying to compare two different Strings by HBS.
The function look like this:
hbs.registerHelper('if_equal', function(a, b, opts) {
if (a == b) {
return opts.fn(this)
} else {
return opts.inverse(this)
}
});
Works great!
But the problem is in this lines:
{{#each info.categories}}
<li>{{this.title}}</li>
{{!-- {{#if_equal this.title "מלגזות"}}
{{/if_equal}} --}}
{{/each}}
s you can see I'm trying check if two string are equal inside the loop.
The problem is how I can back to {{info}} one.
To the global object inside the loop.
And than make loop into the object.
I'm not sure I understand your question, but if you want to access info in the loop you can do it by #root.info
https://handlebarsjs.com/reference.html#data-root
I want to see if the text contained in a span which itself is contained in a div contains certain text.
This is the HTML:
<div class="funds">
<span>banking</span>
<span class="m-l-sm">
<b>EUR 1,000</b>
</span><!--anchor-->
</div>
I want to check if <span class="m-l-sm"> contains 'EUR'.
One way I tried to do this (among several others) is:
var checkFunds = element(by.id("m-l-sm"));
if (checkFunds.getText().toContain('EUR'&'GBP')) {
//do something
}
I get an error saying .toContain() is not a function.
I'm at a bit of a loss as to how to proceed.
.toContain() is a Jasmine matcher's method. It is usually used for assertions, e.g.:
expect(checkFunds.getText()).toContain('EUR');
Since it looks like you actually want to do something if you see a substring in a string - you need to get to the actual text of the element, which means you need to resolve the promise returned by .getText(). Then, you can check if substring EUR is inside the text:
var checkFunds = element(by.id("m-l-sm"));
checkFunds.getText().then(function (text) {
if (text.indexOf('EUR') >= 0) {
// do something
}
});
I had tried looking up on here many different answers to this question and tried using their solutions, but it didn't seem to work, such as this solution:
Is it possible to hide href title?
My question is how am I able to hide the title attribute tooltip when the user mouses over the picture? I tried using the <span title=" ">text</span> but it only caused the title tooltip to show the space or the span's title attribute.
Here is my website.
I figured out the answer to my question. Thank you Gert G for getting me started! =]
What I did in order to hide the title attribute, was first to put everything into a loop because otherwise, it will take the first link's title and apply it to the picture clicked on:
$("a[rel='portfolio']").each(function(e) {
}
Then, I declared a variable that contains the title to whatever elements you want them applied to:
var title = $(this).attr("title");
Once I declared the variable, I then created a function that hides the title when it's moused over, then adds the title back on when I mouseout on it (for the purpose of having my lightbox, ColorBox).
$(this).mouseover(
function() {
$(this).attr('title','');
}).mouseout(
function() {
$(this).attr('title', title);
});
In order for the title to be viewed when click on, you have to add another function:
$(this).click(
function() {
$(this).attr('title', title);
}
);
Putting it all together, it looks like this:
$("a[rel='portfolio']").each(function(e) {
var title = $(this).attr('title');
$(this).mouseover(
function() {
$(this).attr('title','');
}).mouseout(
function() {
$(this).attr('title', title);
});
$(this).click(
function() {
$(this).attr('title', title);
}
);
});
I hope this helps everyone else looking for a similar or this exact solution!
You can check out the changes here.
Thanks Abriel for the solution, I have converted it to YUI 3 and below is the code in case anyone needed it
YUI().use('node', function(Y) {
Y.all("a[rel='portfolio']").each(function(node) {
var title = node.get('title');
node.on('mouseover', function(ev) {
ev.target.set('title', ev.target.get('text'));
ev.target.on('mouseout', function(e) {
e.target.set('title', title);
})
})
node.on('click', function(ev) {
ev.target.set('title', title);
})
})
})
I was looking for a jquery solution but I am using a javascript solution that works fine for me. I needed the "title" attribute to pass descriptive information about a product / image and within that descriptive information there was basic html tags that were needed. And so whenever someone passed the mouse over the image this mixed code and description will popup. This was less than desirable so I am using the following code so that the "title" information is hidden during mouseover but the title information is still available onclick.
Add this in your link code! Hope this helps someone:
onclick=\"javascript: this.title='description and or html goes here' ;\"
onMouseOver=\"javascript: this.title='' ;
Cheers!
Its works like this:
1:Create your own attribute and call it from lightbox
click me
2:Rename the title attribute in jquery file to:
getAttribute('stitle')
I used it for my tooltip, but it should work even without it.
I nested my link and putted title inside it. Than into nested image I´ve wrote title=" " (with that space).
<a href="http://myweb.com" class="tooltip" id="facebook" title="Sing up to my Newsletter"
<img title=" " src="../img/email.png" alt="email icon" width="32">
</a>
Than, when I hover on my email icon, no title is shown.
I'm kind of like stuck trying to implement YUI autocomplete textbox. here's the code:
<div id="myAutoComplete">
<input id="myInput" type="text" />
<div id="myContainer"></div>
</div>
<script type="text/javascript">
YAHOO.example.BasicRemote = function() {
oDS = new YAHOO.util.XHRDataSource("../User/Home2.aspx");
// Set the responseType
oDS.responseType = YAHOO.util.XHRDataSource.TYPE_TEXT;
// Define the schema of the delimited results
oDS.responseSchema = {
recordDelim: "\n",
fieldDelim: "\t"
};
// Enable caching
oDS.maxCacheEntries = 5;
// Instantiate the AutoComplete
var oAC = new YAHOO.widget.AutoComplete("myInput", "myContainer", oDS);
oDS.generateRequest = function(sQuery) {
return "../User/Home2.aspx?method=" + "SA&Id="+document.getElementById("lbAttributes")[document.getElementById("lbAttributes").selectedIndex].value +"&query="+sQuery;
};
oAC.queryQuestionMark =false;
oAC.allowBrowserAutoComplete=false;
return {
oDS: oDS,
oAC: oAC
};
}
</script>
I've added all the yahoo javascript references and the style sheets but it never seems to make the ajax call when I change the text in the myInput box and neither does it show anything... I guess I'm missing something imp...
#Kriss -- Could you post a link to the page where you're having trouble? It's hard to debug XHR autocomplete without seeing what's coming back from the server and seeing the whole context of the page.
#Adam -- jQuery is excellent, yes, but YUI's widgets are all uniformly well-documented and uniformly licensed. That's a compelling source of differentiation today.
To be honest, and I know this isn't the most helpful answer... you should look into using jQuery these days as it has totally blown YUI out of the water in terms of ease-of-use, syntax and community following.
Then you could toddle onto http://plugins.jquery.com and find a whole bunch of cool autocomplete plugins with example code etc.
Hope this helps.