Friday, April 26, 2013

Array to Json in javascript


           In the web developement ,Array to  Json conversion and viceversa are frequently  used.  here  im explaining how to  convert  the date of array  into  json formate.
 
Eg:

   Array name  arr, calling the  arra2json function  by passing the  arr as  parameter.

    var arr = new Array();
     arr['name'] = 'a1';
     arr['address'] = 'a2',
     arr['city'] = 'a3',
     arr['state'] = 'a4'

     array2json(arr);

    /*
    *Function to convert  to  array  to  json  formate
    */
    function array2json(arr) {
        var parts = [];
        var is_list = (Object.prototype.toString.apply(arr) === '[object Array]');

        for(var key in arr) {
            var value = arr[key];
            if(typeof value == "object") { //Custom handling for arrays
                if(is_list) parts.push(array2json(value)); /* :RECURSION: */
                else parts[key] = array2json(value); /* :RECURSION: */
            } else {
                var str = "";
                if(!is_list) str = '"' + key + '":';

                //Custom handling for multiple data types
                if(typeof value == "number") str += value; //Numbers
                else if(value === false) str += 'false'; //The booleans
                else if(value === true) str += 'true';
                else str += '"' + value + '"'; //All other things
                // :TODO: Is there any more datatype we should be in the lookout for? (Functions?)
                parts.push(str);
            }
        }
        var json = parts.join(",");

        if(is_list) return '[' + json + ']';//Return numerical JSON
        return '{' + json + '}';//Return associative JSON
    }

Above function array2json returns the output of the  bellow json formate.

output ->  {"name":"a1","address":"a2","city":"a3","state":"a4"}


Thursday, April 25, 2013

jQuery context menu


context menu  is amenu in a graphical user interface (GUI) that appears upon user interaction, such as a right-click mouse operation

Features


1.trigger contextMenu with right-click, left-click, hover or own custom trigger events
2..delegated event handling removing the need for re-initialization when trigger objects are added / removed
3.dynamic on-demand menu creation
4.optional icons for commands
5.input elements (text, textarea, checkbox, radio, select) within the menu
6.custom html elements (command free)
7.show/hide callbacks to update the state of commands
8.small memory footprint even with hundreds of trigger objects
9.adjust position of menu to fit in viewport
10.enable / disable commands
11.nested sub-menus
12.full keyboard interaction
13.HTML5 <menu> support