Jquery, 'invalid or unexpected token'. Not a string issue - javascript

I'm a newbie to javascript and jquery, and this bug has been hounding me for almost a day. Here's the code:
$('#txtTabContentsHeight', '#ddlTabContentsHeightRuler').blur(function ()
{
//need to check ruler val first!
var sruler = $('#ddlTabContentsHeightRuler').children("option").filter(":selected").text‌​().toLowerCase();
var sval = $('#txtTabContentsHeight').val(); + '' + sruler;
ChangeTabContentsCss(this, 'height');
});
I get a jquery error in my browser console on the $('#ddl...').^^children(... line. Even if I do a $('#ddlTabContentsHeightRuler').val(), I get the same error on the '.' of invalid or unexpected token.
I've checked every single similar discussion here and on the web for this kind of error, and it's always about a string issue, or a syntax issue. But for the life of me, I can't see a syntax problem here. The ddl element is a select element, obviously.
Can someone smack me upside the head with an answer?

Try changing .text() for .val() or .html(). The .text() method cannot be used on form inputs

did u need the semi-colon on $('#txtTabContentsHeight').val(); + '' + sruler;or
$('#txtTabContentsHeight').val() + '' + sruler;

Well, as usual when I have these kinds of errors, if I just RETYPED the whole line, the bug disappeared! I actually did an undo, and tried to delete every single character on the original line, to see if I had some 'hidden characters' or something...and NOPE. Still got the error, though the line looked EXACTLY the same as the one that works.
Is this usual with jquery/javascript? That's sort of unacceptable as a programmer...

As earlier suggested, you could use with cross checking your html code especially the id names of the elements being selected

Related

Too much recursion error using crossfilter

The following page loads in Chrome, but in Firefox/IE the error "too much recursion" happens in the crossfilter.js script (crossfilter.js).
Link:http://bit.ly/1epx0Gs
How can this be avoided (or debugged)?
EDIT
Turns out that Chrome can parse dates with dashes ("6-12-2013"), but firefox/ie need spaces ("6 12 2013")
There's not really any way I can verify that this is the problem without a runnable example, but you probably have non-naturally-ordered values in your dimensions. You need to cast your dimension values and make sure that all your values are valid. The relevant section looks to be:
self.data.push({
index:index,
starttime:new Date(d.starttime),
sex:d.gender == '' ? 'Non-Subscriber' : d.gender,
value:d.count
})
I'd at least change this to:
self.data.push({
index:+index,
starttime:new Date(d.starttime),
sex:d.gender == '' ? 'Non-Subscriber' : '' + d.gender,
value:+d.count
})
The Date() could still be tripping you up if you have invalid d.starttime values, so if you are still getting the error you may want to try replacing it with just "new Date()".
Again, no guarantee that's causing your issue, but when I get these recursion errors, this is usually the cause.
I just encountered the same problem, but the solution was not in the date format but in the encoding of the JS-file itself. Maybe this will help someone else.
I was using following dimension to do some filtering:
CF_data = crossfilter(data);
CF_data_id = CF_data.dimension(function(d) { return +d.properties['Código']; });
Notice the spanish "o" character in the selector of the return statement.
And the following error was thrown:
# too much recursion crossfilter.js:174:9
After checking everything, I noticed that my file was suddenly encoded in ANSI and not in UTF8. So in notepadd++ I converted the file back to UTF8 and the error was gone.

jQuery, how to test of a variable is a text node, containing no markup?

http://jsfiddle.net/DerNalia/zrppg/8/
I have two lines of code that pretty much do the same thing
var doesntbreak = $j("hello");
var breaks = $j(" ");
​The first one doesn't error, but the second one throws this
Syntax error, unrecognized expression:
should'nt they both behave the same?
any insight as to how to solve this?
in the actual method I'm using, ele is from the Dom, so it could eb a text node, or any other kind of node.
UPDATE:
the input to the function that I'm using that I noticed this takes selection from the dom.
updated example: http://jsfiddle.net/DerNalia/zrppg/11/ <- includes html markup.
So, I guess, my question is, how do I test if something is JUST a text node? and doesn't contain any markup?
In general, you cannot create standalone text nodes with the jQuery function. If a string isn't obviously HTML, it gets treated as a selector, and is not recognized by jQuery as a valid selector.
Assuming you want to parse arbitrary strings (which may have HTML tags or not), I suggest something like var result = $('<div></div>').html(' ').contents();. Place your your HTML or text string in a div to parse it and then immediately extract the parsed result as a jQuery object with the list of elements. You can append the resultant list of elements with $(parentElem).append(result);
try this:
function isTextNode(node){
div=document.createElement('div');
div.innerHTML=node;
return $(div).text()==$(div).html();
}
And " " is'nt a valid selector if you want to find a elements containing some text you must use the :contains selector http://api.jquery.com/contains-selector/
Internet Explorer (older versions at least) don't have built in "querySelector" functions, so the Sizzle engine has to do the work directly. Thus, the slightly different tolerances for bogus input can cause differences in error reporting.
Your selector expression " " is equally invalid in all browsers, however. The library is not obliged to quietly accept anything you pass it, so perhaps you should reconsider your application design.
If you want to check for entities, you could use a regular expression if you're confident that it's just a text node. Or you could get the contents with .text() instead of .html().
So, I have to thank Apsillers and Rolando for pointing me in the right direction. Their answers were very close, but gave me the information I needed.
This is what I ended up using:
TEXT_NODE = 3;
objectify = function(n) {
return $j("<div></div>").html(n).contents();
}
function textOnly(n) {
var o = objectify(n);
for (var i = 0; i < o.length; i++) {
if (objectify(o[i])[0].nodeType != TEXT_NODE) {
return false
}
}
return true;
}
And here is a jsFiddle with some test cases, that neither of the original code submissions passed.
to pass, it needed to handle this kind of input
"hello" // true
"hello<b>there</b>" // false
"<b>there</b>" // false
" " // false
Not actual answer, but may help someone with similar issue as mine and loosely related to this question. :)
I was getting same issue today, so fixed by removing
Changed:
var breaks = $j(" ");
to:
var breaks = $j(" ".replace(/&.*;/g, ""));
Here I am removing , < etc...
Note: value at is dynamic for me, so it can be anything.

Illegal Character error in jQuery - regardless of function content

First of all, I've done my research and I did find a bunch of simialr questions. However, I didn't find an answer that applies to my problem. All the examples I found were related to unescaped characters, single/double quote mishaps and the like. I on the other hand am getting this error on the following function:
$('.seq_input').blur(function(){
//var id = $(this).data('id');
//var index = parseInt($(this).val()),
//element = $("#test-list li").eq(id).remove();
//$("#test-list li").eq(index - 1).before(element); // -1 because users like 1 based indices
alert('what?');
})​​​;
As you see I commented out everything and just left an alert, and I'm still getting the error, pointing to the last line of the function. It couldn't have anything to do with other functions because I just added this one alone at the end of my current Javascript.
Can someone please tell me what's going on here? Why on Earth would a function that just alerts something (or even if it doesn't do anything) give an error?
NOTE: error is shown as soon as the page is loaded
There are invisible characters between the trailing semicolon and the parenthesis. I concatenated your code, put it in a string, and called a non-existent function in order to trigger a error (using this method).
'})​​​;'.l()
>>> TypeError: "})\u200B\u200B\u200B;".l is not a function
$('.seq_input') may used on the other functions, try using new id to do that function.

Why is 'indexOf' not returning anything?

The book I am reading tells me to open up the JavaScript console and try the code "foo: bar".indexOf(":"). I've tried it in many ways. I tried removing quotation marks, putting it inside a show() and alert() function. I just can't seem to tease anything out.
Has something changed in JavaScript? Has the author made a mistake? Am I supposed to get no return? Do I need to append document.write, perhaps? Any help greatly appreciated.
Yes something changed in Firefox 5+
However the console (ctrl-shift-k) still works
In the error console (ctrl-shift-J) you will need to wrap it in alert:
foo:bar is a property definition in json, and indexOf is supposed to deal with a left value (string variable, constant, or at least something that can have characters in it. I don't know why the book you are reading wants you to do this, but it doesn't seem to be correct. The correct way to use indexOf would be :
var myObject = {
foo:"bar"
}
alert(myObject.foo.indexOf("a"));
try like follows, it should work. Generally the indexOf() will return -1 if the value to search for never occurs.
var str="foo:bar";
document.write(str.indexOf(":") + "<br />");
The output should be 3

I can't figure out the bug in this jQuery

The page having problems is...
http://schnell.dreamhosters.com/index.php?page=gallery#
I use Firebug to debug my jQuery and other code tidbits and it's been proving very useful for Javascript/jQuery debugging. However, at the same time, it's been one of the most frustrating debugging experiences I've ever gone through. I'm not sure why but sometimes it seems like I can copy someone else's methodology from a tutorial, character for character, and yet still come up with errors.
In any case, the problem here is that Firebug claims there is a bug on line 20 of the source.
missing : after property id
[Break on this error] $('#table').animate({"left: " + attr + "px"}, 2000);\n
This bug seems like a huge load to me because the colon is right there! And this is why debugging jQuery/Javascript is such a pain sometimes. The error messages are rather convoluted and sometimes don't even make a lick of sense to me. Or maybe that's just Firebug.
Either way, the goal I'm going for here is that I'm trying to dynamically change the animate function such that the more you click the left arrow, the further left the grid of images is shifted (due to the nature of the CSS 'left' property). I have Javascript variables and a hidden input tag to help hold essential values, but the major hurdle is getting the animate function to recognize these variables. Near as I can tell it will only accept string literals for arguments on how to animate and the documentation doesn't help me because it doesn't discuss the use of variables with animate, as if it's impossible.
Well, let's just say I don't like impossible, he likes to get in my way a lot.
The object literal passed to the animate function is not well formed, it should be:
$('#table').animate({left: attr + "px"}, 2000);
Edit: Looking closely to your code, you are also trying to get a value from an input with id = "count", and you have a missing # character to have an ID selector:
var count = +$('#count').val(); // get #count value as Number
You are also incrementing this count variable, but you should first convert it to Number, because the value attribute of input elements are string. (I did it using the unary plus operator on the right-hand side of the assignment).
You have to convert it to a number, because if you add two variables and one of them is a string, concatenation will take place:
"1" + 1 == "11"
Try:
$('#table').animate({left: attr}, 2000);
The "px" units of measurement here aren't necessary. That aside, the above is the correct creation of an anonymous object. You were just putting a string inside curly braces.

Categories

Resources