Guidelines: JavaScript Compatibility

From Pandora FMS Wiki
Jump to: navigation, search

It's important to maintain Javascript cross browser compatibility. In order to do this, please respect the following tips.

1 General tips

It's important to define the scope of variables.

  • If you want to create a local variable inside a function then use var statement at declaration time. For example:
function some_function() {
 var parent = value['parent'];
 var child = value['child'];
 .
 .
 .
  • If you want to create a global variable then use var statement outside a function in declaration time. For example:
document.ready( function{
 var global_counter;
 .
 .
 .

2 Jquery UI 1.7

First, if you use the current stable version of Jquery you should not have any problems. If you want to use the Jquery 1.7 drag and drop functionality with IE9 you have to change HTML headers in order to use the IE7 render mode. To render with IE7 mode comment the HTML statement <!DOCTYPE... of the HTML header:


echo '<\!--<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">--\>'."\n";

and set the meta tag compatibility with IE7:


echo '<meta http-equiv="X-UA-Compatible" content="IE=7" >' . "\n";


You have an example in Pandora FMS index.php page (we use drag & drop in visual console editor and preview):


.
.
.
?>							
<?php 
// Render with IE7 mode in visual console editor and preview (due to jquery drag and drop functionality doesn't work in IE9)
if (($sec2 == 'godmode/reporting/visual_console_builder' and $tab_vc == 'editor') or ($sec2 == 'operation/visual_console/render_view')) {
   echo '<\!--<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">--\>'."\n";
   echo '<meta http-equiv="X-UA-Compatible" content="IE=7" >' . "\n";
}
else {
   echo '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">'."\n";
   echo '<meta http-equiv="X-UA-Compatible" content="IE=9" >' . "\n";
}
echo '<html xmlns="http://www.w3.org/1999/xhtml">'."\n";
?>
<![endif]-->
.
.
.