It has been so long since I have needed to create a hyperlink involving an email address, it is good to know there are good resources out there to explain the advanced argument syntax.

http://www.ianr.unl.edu/internet/mailto.html

The other day someone asked me how to validate a multiple select on a form in Javascript. They needed to check that the person filling out the form at least chose one option. This is what I came up with off of the top of my head.

Here is a basic multiple select.

<select id="color" multiple="multiple" size="5">
  <option>Red</option>
  <option>Orange</option>
  <option>Yellow</option>
  <option>Green</option>
  <option>Blue</option>
</select>

Here is the Javascript function code that you can pass a reference to a select to and it will return true if one or more options are chosen, otherwise it will return false.

function multiselect_validate(select) {
    var valid = false;
    for(var i = 0; i < select.options.length; i++) {
        if(select.options[i].selected) {
            valid = true;
            break;
        }
    }

    return valid;
}

Here is an example of how you could call the above function on a select.

// referencing the select above by id
multiselect_validate(document.getElementById('color'));

The example above is a little limited in that it will only ensure that at least one option is chosen. It wont work if you need to check that at least two (or more) options are selected. This modified function can take an additional argument to specify how many options need to be selected.

function multiselect_validate(select, num) {
    if(!num) {
        num = 1;
    }

    var valid = false;
    var found = 0;
    for(var i = 0; i < select.options.length; i++) {
        if(select.options[i].selected) {
            found++;
            if(found == num) {
                valid = true;
                break;
            }
        }
    }

    return valid;
}

This is an installment of Ten Minute Tech; where I pick a technology related subject and then write a paragraph or two about what I know. I then pick and read a reference article related to the subject and then write another paragraph or two about what I learned. This edition’s topic is about Document Type Declaration’s.

Before

In my opinion Document Type Declaration’s (DOCTYPE) are one of the most overlooked items when it comes to web development. What I mean is that many developers don’t use them at all or they use but don’t understand why they should. It really is remarkable how using a proper DOCTYPE in your xhtml files can effect the rendering of your pages, especially when it comes to cross browser coding.

I am not going to go into too much more detail about how a proper DOCTYPE can effect web page rendering (volumes could be written on it); I guess I am just really tired of people still complaining about the Box Model problem in Internet Explorer 6 (if they would use a proper DOCTYPE they wouldn’t have to worry about it).

Now, a DOCTYPE is an instruction (line of code) that links to a file that describes the markup syntax for the rest of the page. Its most practical application is for use at the top of an xhtml or html page to describe to the browser what tags and attributes the page can use in the xhtml/html code. The file the DOCTYPE links to is a language of it own know as a Document Type Definition (DTD).

For a non-technical example take the English language. If you were writing a letter to your friend in English and you wrote at the very top of the letter ‘This letter is written in English’. This would be equivalent to the DOCTYPE. You are simply stating right away what someone is going need to understand in order to read the rest of the letter.

The Document Type Definition (DTD) would be the dictionaries, thesaurus and grammar books that some could use to decipher the message (if they didn’t already know the language).

For the computer a proper DOCTYPE not only declares the language, but it also tells the computer where to find the DTD. This would be like you not only writing the fact that the letter is in English, but also listing a bunch of ISBN numbers for the person to lookup the English books.

DOCTYPE’s and their definitions are typically used to define markup languages (html, xhtml, rss, soap, etc); but I believe they can be extended to almost any type of syntax (if only in theory).

As far as the syntax of the DOCTYPE itself, I myself can never remember, I always have to look them up.

Article: Document Type Declaration

After

The article itself is actually very narrowly written. It focuses on the various html and xhtml DOCTYPE’s (maybe should be expanded). It does however mention the fact that it is used for SGML and XML based documents.

I think the real potential in DOCTYPE’s and DTD’s is the the idea that they are a practical application of a way to create a computer readable language that describes other languages (i.e human languages). I think that this could really be the foundation of something much greater. Just think of a time that we could truly teach a computer how read and understand a human language. The applications in translation and human to computer understanding could be great, and I think we will slowly grow in this direction. I would be interested to know if there are projects and studies out there today that are working toward this very thing.

Some good additional reading is the article on Document Type Definition’s. It goes into the nuts and bolts of how these technologies are used today to describe custom markup languages. Unfortunately this article does not talk about the theory behind it.
http://en.wikipedia.org/wiki/Document_Type_Definition

Here is an article on markup languages in general. It briefly touches on the idea of semantic markup; the idea that the code reflects the [human] meaning of the information inside of it.
http://en.wikipedia.org/wiki/Markup_language

For those of you out there who are trying to keep up with web coding standards may have noticed the ‘target’ attribute for the anchor (a) tag is not supported in xhtml strict. Now I do realize that xhtml has been a standard for some time now (2000ish), but it has only been a few months now that I have been trying to do all of my markup according to the strict standard. Before that (and ever since I knew what a DocType was) I just tried to write my code transitional compliant.

Anyway I guess they have depreciated the ‘target’ attribute (unless you are using frameset) with the idea that the World Wide Web Community has matured to the point that individual users should be able to direct the loading of hyperlinks to the window of their choice (i.e. new tabs, new windows, etc.).

I however, when I realized that the ‘target’ attribute would not validate, I decided to find a way to pull off opening a link in a new window that would not break pages.

Here is what I came up with:

<a href="go.html" onclick="return !window.open(this.href);">Click Me</a>

It requires JavaScript to work but it degrades just fine. If the popup works it will return true and then cause the onclick event to return false and stop the current window from loading the ‘href’. If the popup window fails but JavaScript is enabled on the browser (i.e. the window.open gets stopped by a popup blocker) it will return false and the onclick event will come back true and the page will be loaded into the current window as if the popup was never attempted. And finally if JavaScript is disabled the link will just function normally.