I have researched my problem and tried many different solutions yet I can't seem to find my issue, I assume it has something to do with the way I am calling my variable since it says syntax issue.
When first loading my results page, all results are displayed with a select drop down above those results. What I want to do is when a user clicks on an option on my drop down select is to filter the results based on what they select.
$("#locale").on("change", function(){
for(i = 0; i < storeTitles.length; i++){
if(storeTitles[i].innerText != $("#locale > option:selected").text())
$(".store-item:not(:contains(" + storeTitles[i].innerText + "))").hide();
else
$(".store-item:contains('" + storeTitles[i].innerText + "')").show();
}
});
I have tried many different ways..filter() and using :not() and :contains() combined. My code seems to work when I hard code a value into my :not(contains()). Can anyone spot my syntax issue or suggest a better way to go about this?
You can try this instead
if(~$("#TextBox1").val().indexOf($("#TextBox2").val()){//Contains True}
Related
I have this js code
elem=$(this);
var tester_names="";
tester_names=$("#release_tester_tokens").val();
alert(tester_names)
if (elem.attr('checked')==true)
**tester_names=tester_names+", "+ elem.attr("title");**
alert(elem.attr("title"))
alert(tester_names)
I want to have tester_names=tester_names+", "+ elem.attr("title"); to have the combination of testers_names (a,b,c,d,e) and elem.attr("title") (f) to become (a,b,c,d,e,f)
The alerts that I used is for debugging to see what values are stored in the variable.. They all store correctly, but they don't combine together when I call the bolded function... I just want to know why. I am using formtastic textarea instead of the normal textbox... do I have to adjust to that? Or maybe what the tester_names and elem.attr are outputting are of different type?
I tried it using this type of code (this is nearly the same with different variable names
function updateTextArea() {
var allVals = [];
$('.taglist :checked').each(function(i) {
allVals.push( $(this).val());
});
$('#video0_tags').val(allVals).attr('rows',allVals.length) ;
}
$(function() {
$('.taglist input').click(updateTextArea);
updateTextArea();
});
});
why does this add to checkbox values to the textarea perfectly whenever I check checkboxes when mine just outputs same results before and after using the starred function?
(I don't understand why ppl keep voting this down... its seems like a decent question after the first mishap and fix) :S
Use elem.attr('checked')=='checked' in if statement. There is no case elem.attr('checked')==true will be true. So the body of your if , will never be executed.
I have been using jQuery's find method and it's been very useful.
However, I came across an example where the find seemed to be duplicating things and not returning elements in the order they appeared in the document. (I'm not sure if find is supposed to do this - I doubt it).
However, it shouldn't have duplicates in the elements it finds and show the wrong order, surely?
Full example can be found here: jsFiddle - Notice how span[9] and span[10] are in the wrong order and duplicated.
Why is this the case?
Update
Updated so that output is written to document, please use new link above.
.find() returns elements in document order. More info here: http://docs.jquery.com/Release%3ajQuery_1.3.2
I think the anomaly has something to do with the wildcard selectors. Are those necessary? Removing them seems to resolve the issue.
you add unused * in your code, replace this find with your code:
$('#div1').find("*[class=w_line_" + i + "]").each(function () {
and have this, have good time;
I can´t find anything strange with the order.
$(document).ready(function() {
for (var i = 1; i <= 10; i++) {
console.log(i);
$('#div1').find("*[class*=w_line_" + i + "]").each(function() {
console.log(i, $(this));
});
}
});
This selector seems to return the elements in the same order as yours and I can´t see any duplicates.
$('#div1 *[class*=w_line_' + i + ']')
So I have this funny little problem, where I want to parse the IDs of images. Nothing too complicated... but weirdly enough, my code doesn't seem to work properly. It's weirdddd. Could any care to explain this? I feel blind for not being able to see the error myself.
Here's a snippet of the relevant code that fails to work:
//Toggling images using img-index variable.
img-index = 0;
img-src[0] = $("#ppsfb").attr("id");
img-src[1] = $("#gty").attr("id");
$("#cycle").click(function(){
//Since img-index is just a counter.
if (img-index < 2){
img-index = img-index + 1;
} else {img-index = 0;}
$(img-src[img-index]).fadeIn(1000);
});
img-src is not a valid identifier in JavaScript. That's likely why this is failing.
Check out this fiddle and note the Unexpected token - error
img-index is not a valid variable name in JavaScript, you probably want to use img_index or imgIndex. Also, calling attr('id') on something that comes from an ID selector is pointless, $("#ppsfb").attr("id") is 'ppsfb' or nothing. You're probably better off storing whole jQuery objects in img_src too, your $(img-src[img-index]) wouldn't do what you wanted it to do even after fixing the naming problem. Furthermore, you probably want to hide or fadeout the current image before showing the new one.
img_index = 0;
img_src[0] = $('#ppsfb');
img_src[1] = $('#gty');
$("#cycle").click(function(){
img_src[img_index].hide() // Or .fadeOut or ...
if(img_index < 2)
img_index = img_index + 1;
else
img_index = 0;
img_src[img_index].fadeIn(1000);
});
Presumably you have the positioning, stacking, etc. already sorted out.
A short while back I asked a question here about how I could calculate when a heading was longer than one line within a given container, and subsequently wrap each of these lines in a <span>:
Use Javascript/jQuery to determine where a heading breaks to the next line?
I chose an answer which worked great for me, at least until I checked in IE7 and IE6, in which all the headings handled by this script rendered as
"undefinedundefinedundefinedundefinedundefinedundefined[...]"
on the page. As I'm not really a JavaScript person (that's why I asked such a question in the first place), it's really tough for me to figure out where the problem is. I assumed an undefined variable or something, but I just can't seem to grasp it.
Can anyone help?
I'll repeat the code here, but please refer to the link above for context:
$(function(){
$h = $('.fixed').find('h3');
$h.each(function(i,e){
var txt = $(e).text();
$th = $('<h3 />').prependTo($(e).parent());
var lh = $(e).text('X').height();
$(e).text('');
while (txt.length > 0) {
$th.text($th.text() + txt[0]);
txt = txt.slice(1);
if (($th.height() > lh) || (txt.length <= 0)) {
var shc = $th.text().split(' ');
var ph = shc.slice(0,-1).join(' ')+' ';
if (txt.length <= 0) { ph += shc.pop(); }
$('<span />').text(ph).appendTo($(e));
$th.text(shc.pop());
}
}
$th.remove();
})
});
You need to change
$th.text($th.text() + txt[0]);
to be
$th.text($th.text() + txt.charAt(0));
IE<8 doesn't accept string positions through array indexes ;)
The styling doesn't work, but that'll be a CSS issue which I couldn't fix before leaving. But everything is wrapped in spans :)
Nothing jumps out at me. But, since you mentioned in your comment to your question that you see "undefined" in Firebug, I would start there. Even though those browsers are failing gracefully, the fact that you see undefined there is your first hint to finding the problem for the harder-to-diagnose IE6/7. I would use Firebug and either breakpoint in the function, or use some console.log() calls to document what the values that you are working with are each step of the way. Once you start seeing undefined... you have likely found your problem.
I'm working on an ASP.Net webpage which will use the jQuery Dropdown Checklist (http://code.google.com/p/dropdown-check-list/). I'm fairly inexperienced with JavaScript and completely new to jQuery.
What I want to do is collect the values of the selected items every time a checkbox is checked/unchecked.
Here's what I have so far:
var values = "";
$("#s1").change(function () {
$("#s1").dropdownchecklist(function(selector) {
for (i = 0; i < selector.options.length; i++) {
if (selector.options[i].selected && (selector.options[i].value != "")) {
if (values != "") values += ",";
values += selector.options[i].value;
}
}
});
});
I think the problem is in the 3rd line, but I'm not sure exactly what is wrong.
If anyone could point me in the right direction, I'd appreciate it. Thanks in advance.
Response to zod...
Thanks that was pretty much exactly what I needed. However, I still have some kind of syntactic error. Here's my code:
var values = "";
$("#s1").change(function () {
$("#s1 option:selected").each(function () {
if (values != "") values += ",";
values += $(this).value();
});
alert(values);
});
When I run it, the jQuery Dropdown Checklist looks like a regular list, so I must still have something wrong.
This is somewhat off-topic, but are there any tools that make working with JavaScript and jQuery any easier? I've been spoiled working with Visual Studio and using its debugger and intellisense. Is there anything like that for JavaScript and jQuery?
Response to Ender...
Wow. I like your solution. Yeah, I tend to over-complicate things.
I'm not sure what I did wrong when I tried zod's solution, it probably also works, but I think I'll go with the simpler one.
Thanks for you help.
You don't need to get anywhere near as fancy as you are. Inside your .change() event, simply access the .val() of the select to get the values of the checked items. Like this:
$(function() {
$("#s1").dropdownchecklist();
$('#s1').change(function() {
alert($(this).val());
});
});
See a live demo here: http://jsfiddle.net/Ender/ZsMc4/
Did you try .change()
check this
http://api.jquery.com/change/
http://www.texotela.co.uk/code/jquery/select/