Javascript

Active and updated JavaScript Chart library

Posted on August 28, 2013. Filed under: Javascript | Tags: , |

1. Highcharts: Highcharts is a charting library written in pure HTML5/JavaScript, offering intuitive, interactive charts to your web site or web application. Highcharts currently supports line, spline, area, areaspline, column, bar, pie, scatter, angular gauges, arearange, areasplinerange, columnrange, bubble, box plot, error bars, funnel, waterfall and polar chart types.

2. D3.js: D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.

3. Googlecharts: Google Charts provides a perfect way to visualize data on your website. From simple line charts to complex hierarchical tree maps, the chart gallery provides a large number of ready-to-use chart types.

The most common way to use Google Charts is with simple JavaScript that you embed in your web page. You load some Google Chart libraries, list the data to be charted, select options to customize your chart, and finally create a chart object with an id that you choose. Then, later in the web page, you create a

with that id to display the Google Chart.

4.Datatables: Datatables is a jQuery JavaScript library for HTML table.

Advertisements
Read Full Post | Make a Comment ( None so far )

CKEditor

Posted on February 26, 2010. Filed under: Javascript, Services | Tags: , , , |

CKEditor (formerly FCKeditor) is an open source WYSIWYG text editor from CKSource that can be used in web pages. It aims to be lightweight and requires no client-side installation.

Its core code is written in JavaScript, having server side interfaces with Active-FoxPro, ASP, ASP.NET, ColdFusion, Java, JavaScript, Lasso, Perl, PHP and Python.[3]

CKEditor is compatible with most Internet browsers, including: Internet Explorer 6.0+ (Windows), Firefox 2.0+, Safari 3.0+, Google Chrome (Windows), Opera 9.50+, and Camino 1.0+ (Apple).[3]

Reference:

http://en.wikipedia.org/wiki/CKEditor

http://ckeditor.com/

Read Full Post | Make a Comment ( None so far )

How to add the “Select All/ DeSelect All” checkbox to the Webpage in javascript?

Posted on April 7, 2008. Filed under: Javascript |

How to add the “Select All/ DeSelect All” checkbox to the Webpage in javascript?

Some samples as following:

<script   language= “JavaScript “> 
function   cball(obj) 

  for(i   =   0;i <document.getElementsByName( “m “).length;i++) 
{   
document.getElementsByName( “m “)[i].checked=obj.checked 

function   cball2(obj) 

  for(i   =   0;i <document.getElementsByTagName( “INPUT “).length;i++) 

  if(document.getElementsByTagName( “INPUT “)[i].name.substr(0,1)== “m “)   

  document.getElementsByTagName( “INPUT “)[i].checked=obj.checked 



</script> 

<form   name= ‘f1 ‘   id= ‘f1 ‘> 
  <input   name= “allcheckbox ”   type= “checkbox ”   title= ‘Select All/Deselect All ‘   onclick= “cball(this) “> Select All<br/>   
  <input   name= “m ”   type= “checkbox ”   onclick= ‘ ‘> <br/>       
  <input   name= “m ”   type= “checkbox ”   onclick= ‘ ‘> <br/>       
  <input   name= “m ”   type= “checkbox ”   onclick= ‘ ‘> <br/>       
  <input   name= “m ”   type= “checkbox ”   onclick= ‘ ‘> <br/>       
  <input   name= “m ”   type= “checkbox ”   onclick= ‘ ‘> <br/>       
  <input   name= “m ”   type= “checkbox ”   onclick= ‘ ‘> <br/> 
</form>

 

Another one sample is:

when select all checkbox, the “Select ALL/DeSelect All” checkbox should checked automatically:

<script   language= “javascript “> 
function   cball(){ 
    //alert(document.getElementById( “all “).checked) 
    var   oform=document.getElementById( “f1 “); 
    var   oc=oform.childNodes; 
    for   (i=0;i <oc.length;i++){ 
        if   ((oc(i).type)== “checkbox “) 
            oc(i).checked=(document.getElementById( “all “).checked?true:false); 
    } 

function   cnall(obj){ 
    var   ock=document.getElementById( “all “); 
    var   noChek=0; 
        if   (obj.checked==false) 
            ock.checked=false; 
    var   oform=document.getElementById( “f1 “); 
    var   oc=oform.childNodes; 
    //alert(obj.checked); 
    for   (i=0;i <oc.length;i++){ 
          if   ((oc(i).type)== “checkbox “){ 
              if   (oc(i).checked==true) 
                  noChek+=1; 
          } 
      } 
      //alert(noChek); 
      if   (noChek==6) 
          ock.checked=true; 
      

  </script> 

<form   name= ‘f1 ‘   id= ‘f1 ‘> 
  <input   id= “all ”   name= “allcheckbox ”   type= “checkbox ”   title= ‘SelectDeSelect’   onclick= “cball() “>Select All<br/>       
  <input   name= “m1 ”   type= “checkbox ”   onclick= ‘cnall(this) ‘> <br/>       
  <input   name= “m2 ”   type= “checkbox ”   onclick= ‘cnall(this) ‘> <br/>       
  <input   name= “m3 ”   type= “checkbox ”   onclick= ‘cnall(this) ‘> <br/>       
  <input   name= “m4 ”   type= “checkbox ”   onclick= ‘cnall(this) ‘> <br/>       
  <input   name= “m5 ”   type= “checkbox ”   onclick= ‘cnall(this) ‘> <br/>       
  <input   name= “m6 ”   type= “checkbox ”   onclick= ‘cnall(this) ‘> <br/> 
</form>

Read Full Post | Make a Comment ( None so far )

Liked it here?
Why not try sites on the blogroll...