JavaScript and Expecting more source characters

This message was seen by me, and certainly troubling at the least, why?  The message, Expecting more source characters, what does that mean?  It didn’t initially alarm me as it was a warning, but when I received the following dialog displaying on the page I was testing;

image

I was looking at that to think that I got the naming wrong, or something else.

The reason for the dialog.  The JavaScript on the page could not be loaded?  Why?  There was an error in the JavaScript that prevented it.  Now, web pages can run without the backing of the JavaScript, just the functionality provided by the JavaScript will not be there and other errors would result.

The reason for the JavaScript not loading.  The warning, “Expecting more source characters”.  Not to mention it was highlighting the line in Visual Studio;

Why was the error being reported there, next to the less than sign.

image

Of course I am tried looking over the JavaScript seeing as I had just added some code to it and it was working fine the night before.  Then, it struck me, I looked over each of the new lines I added and found it.  The braces { } that are used in C based languages were not matching.

This is a fairly major problem.  Certainly in C languages the braces are use to know when sections start and end, like in VB using the End If, or End Sub, they define the end of a scope block or block.  So I wondered by the Warning instead of an error, and secondly, why couldn’t the message more informative.

Below is the code that I had, that was causing the error;

if (currentControl.text == original) 
{
    if (changedBy.value == currentControl.id)
    {
        saveButton.disabled = true;
        cancelButton.disabled = true;
    {
    return true;
}

Easy enough to see there, but certainly amongst all of the JavaScript the curly braces do tended to blend into one another, especially from my perspective of coming from a more verbose language.   

I fixed up the braces so they open, then close correctly, the warning goes away and the application runs without dialogs.

My recommendation when you see this message, or come across the dialog box like the one above, just go line by line over the JavaScript and make sure that each line ends in a semi-colon (;), there are times when they aren’t needed and times when they are optional.  If optional, include them anyway.  Check all opening and close brackets () make sure they match that all open brackets are closed.  Check the braces {}, make sure all open braces are closed. 

There are times when braces are options, single line if statements;

if (value == true)
    value = false;

There are other occasions as well which I will not go into.  A good recommendation, especially for those who do not come from a C language background.  Use them anyway, it does nothing to the end product of the application and can help readability.

if (value == true)
{
    value = false;
}

if (value == true) {
    value = false;
}

The first one is my preferences as it does show the opening and closing braces lining up.  The second way, reminds me a little of the VB method in that you write;

If value = True Then
    value = False
End If

As the Then statement matches the { and the End If matches the }, my preference is the lining up method.  But choose what way best suits your style and understanding.

NOTE:  How did I really find the error of my ways.

imageI tried to debug, as I am unable to debug in Visual Studio 2008 (debug client side JavaScript that is), I have to use the debugger in IE or Firefox, when I detached the VS2008 debugger and started the IE debugger.  I went to set a breakpoint and the following message came up.  This then highlighted to me because the JavaScript hasn’t loaded then there is a syntax error in the JavaScript.  So I set about hunting it down.

Advertisements

Posted on October 18, 2012, in Development, Tips and Tricks and tagged , . Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: