Strange empty text line appearing inside my page
Usually you see an empty text line and you look at the source and you see nothing there just a space…
That happens often when the files that are outputted are using the encoding UTF8 with signature, instead of using the correct encoding UTF8 without signature.
base html tag does not apply correctly to all javascript and style files
Problem: The
<base href="http://example.com/path/to/res/">
did not work at all on Internet Explorer – no javascript or style files were loaded and worked partially in Mozilla Firefox – a few javascript files were not pointing to the path that should be transformed by base href attribute.
Example:
Array( [0] => 1 ) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <base href="http://example.com/path/to/res/"> <link rel="stylesheet" href="./css/styles.css" type="text/css" /> <scrupt src="./js/jquery.js" type="text/javascript"></script> <scrupt src="./js/j1.js" type="text/javascript"></script> <scrupt src="./js/j2.js" type="text/javascript"></script>
This code produced a page with no style files and no javascript files included in Interenet Explorer 8 and a few javascript files (j1.js and j2.js) were not included in Firefox 3.5 because base tag was not applied. After several tests and all kind of different arrangements we discovered that the problem was the output before the page source the
Array ...
thing.
Solution: no output before the page’s headers otherwise you can get all kind of strange results including a html base tag not working correctly.
Problem: When submitting a form, seems like another form gets submitted
Actually, I had two forms on the same page, one with the GET method (let’s call it get_form), the other with the POST method (we’ll call it post_form). When I pressed the submit button of get_form it seemed that the post_form got submitted. In fact, all the variables in get_form and post_form were passed with the POST method.
So the natural thing that came into my mind was that the two forms were intersecting. But how? I knew for sure they were separate forms because get_form was in a file that I was including in the file that contained post_form, after post_form.
After verifying the HTML source over and over again I finally solved the mistery. There was a stupid mistake I made: I did not close post_form properly. Instead of using the form closing tag </form> at the end of post_form, i put the form opening tag <form> and every time I checked for the problem, I missed an important detail: the lack of the slash sign.
Conclusion: When opening a HTML element, make sure to close it accordingly.
How to check/uncheck a bunch of checkboxes without using ids for the checkbox inputs
My solution of checking/unchecking a group of HTML checkboxes using Javascript implies using an array of checkboxes, which means naming all the inputs of type ‘checkbox’ like array_name[]. Example:
<form name="cb_form"> <input type="checkbox" name="cb[]" value="0" />Zero <input type="checkbox" name="cb[]" value="1" />One <input type="checkbox" name="cb[]" value="2" />Two <input type="checkbox" name="cb[]" value="3" />Three </form>
In this example, the name of the checkboxes array is cb.
Next, we place two links for checking/unchecking all checkboxes in our array. If someone clicks one of these links, the checkAll() JavaScript function is called:
<a href="" onclick="checkAll('cb_form', 'cb[]', true); return false;">Check all<a>
<a href="" onclick="checkAll('cb_form', 'cb[]', false); return false;">Uncheck all<a>
The checking/unchecking all checkboxes function in JavaScipt looks like this:
function checkAll(form_name, cb_name, value)
{
var cb_arr = document.forms[form_name].elements[cb_name];
// if the checkboxes exist
if(cb_arr)
{
// if the number of checkboxes is at least 2
if(cb_arr.length > 1)
{
// for each checkbox
for(i = 0; i < cb_arr.length; i++)
{
// check (value == true) or uncheck (value == false) it
cb_arr[i].checked = value;
}
}
else // cb_arr.length is undefined which means there is a single checkbox element that is not considered an array of one element
{
cb_arr.checked = value;
}
}
}
Note that if we only have one checkbox, the variable cb it is not considered an array, but a normal variable. This is useful in the situation of dinamically generated HTML pages (using PHP, for example) and the number of checkboxes varies from page to page.
You can test the example here:
