Find length of given items in a table using jquery code (tooltips)


//Click button Event



 $(".tabs-menu a").click(function(event) {

        
           $('.tab').hide(0, function(){            

            $('#dvLoading').show(0, function(){             
                $('.tab').delay(800).show(0,function(){
                  $('#dvLoading').hide();  
                }); 

               });
           });

        var tab_id = $(this).attr("href");
               var map = {}, array = [];
        var $tds = $(" "+tab_id+" table tr ").slice(1).find('td:nth-child(5) span').each(function () {
            var data = $(this).text();
            var arr = data.split('$');
            var value=parseInt(arr[1]);           
            if (map[value]) {
                map[value].push(this);
            } else {
                map[value] = [this];
                array.push(value);
            }
        })      

        array.sort(function(a1, a2){
            return a1 - a2;
        });
        $tds.filter(function () {
            var data = $(this).text();
            var arr = data.split('$');
            var value=parseInt(arr[1]);
            return $.inArray(value, array) < 1;
        }).addClass('alert');

        $(this).parent().addClass("current");

        $(this).parent().siblings().removeClass("current");
        var tab = $(this).attr("href");
        $(".tab-content").not(tab).css("display", "none");
        $(tab).fadeIn();
   
  
    });
    

    //Tool tip



       $(".tabs-menu a").mouseover(function(event) {

           var tab_id = $(this).attr("href");
           
          var length=$(" "+tab_id+" table > tbody > tr").length;
          if(length > 0){length=length-1; } 
          $(this).attr("title", ""+length+" Flights");

        });


       $( document ).tooltip({
          position: {
          my: "center bottom-20",
          at: "center top",
          using: function( position, feedback ) {
          $( this ).css( position );
          $( "<div>" )

          .addClass( "arrow" )
          .addClass( feedback.vertical )
          .addClass( feedback.horizontal )
          .appendTo( this );
          }
          }
        });

});


/// CSS Requirement.


.tabs-menu li a {
    text-transform: uppercase;
color: #FFF;
text-decoration: none;
padding: 0px 20px;
font-weight: bold;
font-size: 25px;
}

Comments

Popular posts from this blog

how to customize dashboard in active admin gem in rails 4

fibonacci series in Ruby

Simple calculator using JQuery and HTML..