We Keep Coding

JS HTML DOM typeMismatch error

I am using XHTML, JSF and JavaScript to create a form, validate the information that has been submitted into their respective fields through the use of a onclick() in a h:commandButton.
I have managed to create a JS file that checks for empty fields and alerts the user if true, that works fine. I next wanted to try to make sure that the input matches the type defined in the tag using the typeMismatch property, in a function i've called Validity. Here is my code so far:
function Validity() {
var checkName=document.getElementById("formdiv:cardName");
var checkCard=document.getElementById("formdiv:cardnumber");
var checkExp=document.getElementById("formdiv:expDate");
var error="";
var inputChecks=[checkName, checkCard, checkExp];
for (i=0; i < inputChecks.length; i++){
if(inputChecks[i].value.validity.typeMismatch){
error= "Your fields dont match the required input type. E.g Card Number must be a number"
}
}
document.getElementById("errorMessage").innerHTML=error;
}
My problem lies on line 48 where i get a "Uncaught TypeError: Cannot read property 'typeMismatch' of undefined'. I have only been coding JS for a week so am relative new to it, so I'm sure it's down to how I'm declaring/ referencing something. I've have already checked w3schools and other sources all to no avail. So I'm hoping someone here will be able to help. Any suggestions would be greatly appreciated

The only thing that we can discern from the code you've given and the error is that the 'validity' property hasn't been defined.
It's important to note the difference between null and undefinied in JavaScript.
Effectively the fact that it's undefined suggests that it's never been set. My guess would be that you have some problem where either the code that's setting the validity property isn't being executed, or it's behaving differently than what you'd expect.
If you add more information such as the rest of the code (JavaScript and XHTML) someone might be able to answer more specifically.
Truthy and Falsy values might also be useful to learn about as it's quite common for these sorts of things to unexpectely happen

Why doesn't IE8 like this JS?

IE8 has been throwing this error at me
SCRIPT65535: Unexpected call to method or property access.
load-scripts.php, line 4 character 25690
I removed a .js file from the code, and the error went away. I started commenting functions out, and narrowed it down to this one. With this one commented, I don't get the error. With it active, I do get it
$("title, .ab-item").each(function() {
var text = $(this).text();
text = text.replace("RepAgent", "Review Scout");
$(this).text(text);
});
I've used JSHint and it says that it's valid?

I'm pretty sure that Internet Explorer doesn't like you messing with <title> element contents. That's not really how you set the document title anyway; just set document.title.

jQuery uses appendChild inside $.text() .
Although <title/> has a appendChild-method(inherited from HTMLElement), this method may not be used.(it's also not listed in the title-methods)

Google closure compiler javascript parse error

I am trying to use google closure compiler on my javascript files. It works fine except for the following piece of code:
function goto(form) { var index=form.select.selectedIndex
if (form.select.options[index].value != "0") {
location=form.select.options[index].value;}}
The compiler returns:
JSC_PARSE_ERROR: Parse error. missing ( before function parameters. at line 1 character 9
function goto(form) { var index=form.select.selectedIndex
There is a caret (^) pointing to the g in "goto" when it is output on the screen.
I am using just the basic UI version here to test:
http://closure-compiler.appspot.com/home
Any idea what is wrong with the javacript? It seems to work just fine but I am not a javascript person so I have no clue how to fix it. Thanks,
Bill

I am not sure why #Sirko deleted his answer. So I will add it.
You need to change the name of the function goto to something else. Something like gotoUrl, gotoPage, etc.
It was a reserved word in ECMAScript 3, but removed in ECMAScript 5. I am guessing the closure compiler uses that older list still.

Javascript regex match fails on actual page, but regex tests work just fine

I have a very specific problem concerning a regular expression matching in Javascript. I'm trying to match a piece of source code, more specifically a portion here:
<TD WIDTH=100% ALIGN=right>World Boards | Olympa - Trade | <b>Bump when Yasir...</b></TD>
The part I'm trying to match is boardid=106121">Olympa - Trade</a>, the part I actually need is "Olympa". So I use the following line of JS code to get a match and have "Olympa" returned:
var world = document.documentElement.innerHTML.match('/boardid=[0-9]+">([A-Z][a-z]+)( - Trade){0,1}<\/a>/i')[1];
the ( - Trade) part is optional in my problem, hence the {0,1} in the regex.
There's also no easier way to narrow down the code by e.g. getElementsByTagName, so searching the complete source code is my only option.
Now here's the funny thing. I have used two online regex matchers (of which one was for JS-regex specifically) to test my regex against the complete source code. Both times, it had a match and returned "Olympa" exactly as it should have. However, when I have Chrome include the script on the actual page, it gives the following error:
Error in event handler for 'undefined': Cannot read property '1' of null TypeError: Cannot read property '1' of null
Obviously, the first part of my line returns "null" because it does not find a match, and taking [1] of "null" doesn't work.
I figured I might not be doing the match on the source code, but when I let the script output document.documentElement.innerHTML to the console, it outputs the complete source code.
I see no reason why this regex fails, so I must be overlooking something very silly. Does anyone else see the problem?
All help appreciated,
Kenneth

You're putting your regular expression inside a string. It should not be inside a string.
var world = document.documentElement.innerHTML.match(/boardid=[0-9]+">([A-Z][a-z]+)( - Trade){0,1}<\/a>/i)[1];
Another thing — it appears you have a document object, in which case all this HTML is already parsed for you, and you can take advantage of that instead of reinventing a fragile wheel.
var element = document.querySelector('a[href*="boardid="]');
var world = element.textContent;
(This assumes that you don't need <=IE8 support. If you do, there remains a better way, though.)
(P.S. ? is shorthand for {0,1}.)

SurroundContents on a range spanning multiple tags (getRangeAt problem?)

I have a script that (I think) needs to use surroundContents to wrap the selection area. Doing so allows me to append something, and then reassign the range as the selection.
I believe I've narrowed the problem down to a misuse of getRangeAt, but I'm not quite sure how to correct it.
Here's the brief bit of code:
function getRangeObject(selectionObject) {
// Moz
if (selectionObject.getRangeAt) {
return selectionObject.getRangeAt(0);
}
And here's line 89 where it throws an error at me:
rangeObject.surroundContents(newNode);
And of course, here's the error:
Error: uncaught exception:
[Exception... "The boundary-points of
a range does not meet specific
requirements." code: "1" nsresult:
"0x805c0001
(NS_ERROR_DOM_RANGE_BAD_BOUNDARYPOINTS_ERR)"
location:
"http://www.latentmotion.com/insertNode/index26.html
Line: 89"]
If it's helpful to see the whole thing, you can view the script (so far) here:
http://www.latentmotion.com/insertNode/index26.html
And the text selection helper that I was going off of was quirksmode - which doesn't detail the use of multiple ranges, located here.
Thanks in advance for your help.

I think the error message describes the problem well. This section of the DOM Range spec describes what leads to an exception being thrown by a Range when using surroundContents.