View Single Post
Old 11-09-2012, 06:02 PM   PM User | #1
robfxp
New to the CF scene

 
Join Date: Nov 2012
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
robfxp is an unknown quantity at this point
run a element specific function on page load

Guys,

sort of a simple one, kinda new to JS, so this has me stumped.

have the below code that minimizes / max a column in a table with max and min hiperlinks - the idea is, there is alot of data to display, so this hides the huge data in certain columns untill the user wants to view it.

all i want is for the columns to be minamized on page load. but i am not sure how to do this as the JS function uses a passed page element var. so in short just want to run the below on page load, but I have mutaple cols with min and max in the first td

Code:
$(function(){
  $("thead a").click(function(){
    var myIndex = $("thead td").index($(this).parent());
    var pxWidth = ($(this).attr("href") == "#max") ? "auto" : "5px";
    var hideContents = ($(this).attr("href") == "#max") ? false : true;
    
    $("thead tr").each(function(){
      $("td",this).eq(myIndex).css("width",pxWidth).css("overflow","hidden");
    });  
    $("tbody tr").each(function(){
      var el = $("td",this).eq(myIndex);
      el.css("width",pxWidth);
      if(hideContents){
        $("div",el).hide();
      }else{
        $("div",el).show();
      }
    });
    return false;
  });
});
any help is appreciated!

Last edited by robfxp; 11-09-2012 at 08:00 PM..
robfxp is offline   Reply With Quote