XHTML compliant with ampersands in the URL

I was having a few problems creating a page with ampersands in the URL. This is a quick fix if it’s part of the HTML by using & but if it’s part of a javascript, it will take the code literally. For example, let’s say you have a javascript function that sends you to a URL when you click a button.

<script type=”text/javascript”>

function clickMe() {
window.location = ‘http://www.google.com/search?q=javascript+ampersand+xhtml&client=firefox-a’;
}

</script>

If you are concerned about being XHTML compliant, you will get an “unknown entity section” error. You can get some more info of the error here http://htmlhelp.com/tools/validator/problems.html. You cannot use “&” in the URL of that javascript function. You can use &amp; (HTML) or &#38; (ASCII). It will solve your error but depending on the browser/version, it will send the code to the URL and will result in an error – especially if your code is dependent on the querystring. To fix this you can use CDATA.

/*<![CDATA[*/

window.location = 'http://www.google.com/search?q=javascript+ampersand+xhtml&client=firefox-a';

/*]]*/

The /**/ ignores the lines of code but because your document is XML formatted, CDATA parse the line in between properly (http://www.w3schools.com/xml/xml_cdata.asp). I got answer from http://www.liferay.com/community/forums/-/message_boards/message/2657431#_19_message_2873280.

Form validation that contains arrays from checkboxes and radio buttons with jQuery

I’m using the jQuery plugin from http://bassistance.de/jquery-plugins/jquery-plugin-validation. The plugin is greate. I did run into a problem with arrays. Say your form has a group of checkboxes or radio buttons and their names are checkbox or radio. To have them be in the same group, their names have to be the same and to process it using PHP as post variables you have to throw them in arrays. So in the form their names will be checkbox[] or radio[].

In your validation you probably have something like

rules: {
checkbox: { required: true },
radio: { required: true }
}

The element name no longer matches because in your form they are checkbox[] and radio[] while in your javascript they are checkbox and radio. To solve this, use quotes and add the []. So here’s a quick example.

<script type=”text/javascript”>
$(document).ready(function()
{
$(‘#form1′).validate({
rules: {
“checkbox[]“: { required: true },
“radio[]: { required: true }
}
});
});
</script>

<form id=”form1″>
<input name=”checkbox[]” type=”checkbox” value=”checkbox1″ /> checkbox 1
<input name=”checkbox[]” type=”checkbox” value=”checkbox2″ /> checkbox 2

<input name=”radio[]” type=”radio” value=”radio1″ checked=”checked” />radio  1
<input name=”radio[]” type=”radio” value=”radio2″ />radio  2
</form>

The radio button is an overkill since you normally have 1 checked by default unless you forget. The plugin is great so if you haven’t checked it out, I highly recommend it.