Javascript/CSS 100% Height (Max-Height) Function
May 28th, 2008
We can’t tell you how much we love wrestling with CSS bugs/oversights. There’s not a time when we wouldn’t want to kick back, relax, and fumble through 10-odd google pages, looking for a simple solution for giving an element 100% height.
So far, this is one of the best - 100% height solutions out there - looks like the handy work of ppk.
If you’re looking for a quick javascript fix, you’re at the right place! This function below will take in 3 parameters: The Content Object, the Container Object, and the amount of offset you’ll need.
- The Content object will contain your variable content (e.g. a <div> object), and the
- Container object will then be resized by the amount of
- Offset you have defined
Javascript Max-height Solution:
/*****************************
name: makeFullHeight
desc: gets the height of the content div, and resizes
the container to an exact px so that it's child
elements will fill 100% height
param: contentobj - the content object (e.g. a div)
containerobj - the container object that
is being resized
offsetpx(integer) - integer amount of px to
offset, this will change depending on your
application
note: MUST BE CALLED AFTER ELEMENTS HAVE
LOADED (or before the </body> tag)
*****************************/
function makeFullHeight(contentobj,containerobj,offsetpx){
if(contentobj && containerobj){
var contentHeight = contentobj.offsetHeight;
var newHeight = contentHeight + offsetpx;
containerobj.style.height = newHeight + 'px';
}
}
Set all checkboxes to disabled, Check all Checkboxes
April 30th, 2008
The following code will iterate all your checkbox elements (within the form you specify), and disable them all. Tested in ie and mozilla only.
function disableAllChecks(fmobj) {
for (var i=0;i
if ( e.type=='checkbox' ) {
e.disabled = true;
}
}
}
If you want to check the checkboxes, change the red line to
e.checked = true;
IE Select Option Bug - Selected, SelectedIndex
April 17th, 2008
In case anyone else is coming across this issue, for some reason, when attempting to select all options in a multi-select “<select>” box, for some reason, IE doesn’t work the first time through my iteration. Here is more:
WORKAROUND
Don’t set Multiple immediately before selecting options
Alright, I found it - for some reason, when you use javascript to set the “multiple=true”, you cannot then immediately set selected=’true’. It just doesn’t work in Internet Explorer. (Or at least we couldn’t get it to work - please let us know if you find another solution).
The Old Function
function selectAll(selector){
if(!selector)alert('Selector doesnt exist');
else{
selector.multiple=true;
for(var i=0;i
}
return false;
}
}
The New
function selectAll(selector){
if(!selector)alert('Selector doesnt exist');
else{
/**selector.multiple=true; Call this far in advance, or have it already set to “multiple”**/
for(var i=0;i
}
return false;
}
}
Line Breaks, Carriage Returns from PHP to Javascript to HTML
February 27th, 2007
My gosh, I have struggled with this conversion too many times! I shall endeavour to put an end to my troubles and anyone else’s who develops across all the layers.
The Problem: PHP is outputting the value of a textarea within javascript, which in turn is causing the javascript error “unterminated string literal…”
The Long Answer: Line Breaks, Carriage Returns, and Newline characters have different character representations depending on which language you’re in, and more so - how the character is being displayed. It seems when you pull a newline character from a mysql db, and display it in php it is displayed in ASCII format. I, myself am not all too familiar with it, but I do know it seems to be the format that the db stores data. Check out this ascii conversion table to see what all of our html characters translate to in ascii.
The Short Answer: You need to convert your ascii line breaks (both Line Break “\n” & Carriage Return “\r”) to javascript line breaks:
Solution:
$escaped_value = str_replace(chr(13),'n',$report[$column_name]); $escaped_value = str_replace(chr(10),'',$escaped_value);
Explanation: In the first line, we use str_replace to convert chr(13) to javascript line break “\n”. Then in the second line, we convert the other possible line break (or carriage return) chr(10) to nothing (so as to prevent duplicate line breaks).