ExpressionEngine CMS
Open, Free, Amazing

Thread

This is an archived forum and the content is probably no longer relevant, but is provided here for posterity.

The active forums are here.

Flexigrid - Lightweight but rich data grid

March 28, 2008 10:13am

Subscribe [82]
  • #151 / Apr 10, 2008 12:39pm

    dark_lord

    103 posts

    Glad I could help! 😊

    One more question?

    How come my first column of my record does not display(e.g. ID)? It starts with the second column (e.g. Name)? What could be the problem with my code?

    yah I got it! hehehe.. sorry I miss that other ID.. hehe.. Thanks again.. cheers!

  • #152 / Apr 10, 2008 12:49pm

    dark_lord

    103 posts

    Did you modify the /system/application/controller/ajax.php controller? If so can you post the “foreach” code, the one that runs through all db query records?

    What about hiding a column(Hiding it by default)? Like for example the Printable name? any added parameter for that?

  • #153 / Apr 10, 2008 1:11pm

    Armorfist

    121 posts

    Good call!
    I forgot to add that option. Its easy to implement tho:

    On the file system/application/helpers/flexigrid_helper.php on line 57

    Replace:

    $grid_js .= "{display: '".$value[0]."', ".($value[2] ? "name : '".$index."'," : "")." width : ".$value[1].", align: '".$value[3]."'},";

    With:

    $grid_js .= "{display: '".$value[0]."', ".($value[2] ? "name : '".$index."'," : "")." width : ".$value[1].", align: '".$value[3]."'".(isset($value[5]) && $value[5] ? ", hide : true" : "")."},";

    Then, in the flexigrid.php controller, on the colModel array insert a new BOOLEAN value at the end, TRUE or FALSE:

    E.g.

    $colModel['id'] = array('ID',40,TRUE,'center',2,TRUE);

    TRUE - Hidden
    FALSE - Show

    If you do not insert a value it will show by default.

    E.g.

    $colModel['id'] = array('ID',40,TRUE,'center',2);

    I will add this later to the download zip.
    Thanks

  • #154 / Apr 10, 2008 10:10pm

    ecarsted

    19 posts

    Heya Paulo,

    Sorry for the re-request ;

    How do i get the row id so I can create a call to get the details for that record;

    function yourfunction()
    {
    $(".selectrow").click(function(){
    alert("HIT!");    (Something goes here to get the row id)
    });
    }

    Eric

  • #155 / Apr 10, 2008 10:37pm

    dark_lord

    103 posts

    Just an idea, anyway, Flexigrid rocks! Kudos Paulo! Good Job! 😊

    : Just want to thank you all guys for the help. Y’all a master!

    : By the way, suggest what about check box instead of highlighting? to check the record(s) before going to delete? Would that be possible, at least I can say, a user can verify or confirm easily that he/she is going to delete a or those records just by seeing a check in the tick box?

    Would that be possible? Hope you can do that too, I want to do it, but “he,he,he,” not a master like you guys… peace.V,,

    Thanks and hope to see that feature.

  • #156 / Apr 11, 2008 2:20am

    thenike

    1 posts

    Hi Paulo, Great Job! I have been looking into various grid frame works and yours is the best from what I have seen so far!

    I got your 3rd example working with a php back end (php creating xml data). I would like to extend this to the next level and I am not sure what I should do here.

    My task is to get a live data grid going…, I have a mysql table getting updated every second and I like that data to be pushed/pulled to the flexigrid.

    I try to do the page refresh, but that is not efficient. Is there a way to update the table every 1second? Please let me know of any solutions. Any code snips will be much appreciated, as I am still learning java scripting.

    Thanks,

    Nikke,

  • #157 / Apr 11, 2008 6:32am

    Synergiq

    12 posts

    What’s the largest amount of records anyone has used with this? I’m trying to use about 1200 but it’s dying. I’m not sure if it’s too much for the grid or if it’s because I’m using asp and sybase so I cant use LIMIT.

  • #158 / Apr 11, 2008 7:34am

    wiredesignz

    2882 posts

    @Synergiq, I have a paging class for vbscript if you’re interested.

  • #159 / Apr 11, 2008 9:15am

    paulopmx

    164 posts

    Heya Paulo,

    Sorry for the re-request ;

    How do i get the row id so I can create a call to get the details for that record;

    function yourfunction()
    {
    $(".selectrow").click(function(){
    alert("HIT!");    (Something goes here to get the row id)
    });
    }

    Eric

    Where are you going to attach this event? to the process API?
    Do you want to call the function when the user clicks the row or a cell or a link inside a cell?

  • #160 / Apr 11, 2008 9:18am

    paulopmx

    164 posts

    Hi Paulo, Great Job! I have been looking into various grid frame works and yours is the best from what I have seen so far!

    I got your 3rd example working with a php back end (php creating xml data). I would like to extend this to the next level and I am not sure what I should do here.

    My task is to get a live data grid going…, I have a mysql table getting updated every second and I like that data to be pushed/pulled to the flexigrid.

    I try to do the page refresh, but that is not efficient. Is there a way to update the table every 1second? Please let me know of any solutions. Any code snips will be much appreciated, as I am still learning java scripting.

    Thanks,

    Nikke,

    Let me see how about this, after running flexigrid you can call a function that you can assign to a setTimeout method:

    myfunc();
    
    function myfunc()
    {
    
    $('.flextable').flexReload();
    setTimeout('myfunc()',1000);
    
    }

    something like that.

  • #161 / Apr 11, 2008 9:21am

    paulopmx

    164 posts

    Did you modify the /system/application/controller/ajax.php controller? If so can you post the “foreach” code, the one that runs through all db query records?

    What about hiding a column(Hiding it by default)? Like for example the Printable name? any added parameter for that?

    Hi wish_bear,

    In my example 3, i hid the column ISO3 by default using this settings in the colModel

    {display: 'ISO3', name : 'iso3', width : 130, sortable : true, align: 'left', hide: true}

    the setting ‘hide:true’ would hide it by default.

  • #162 / Apr 11, 2008 9:22am

    paulopmx

    164 posts

    Just an idea, anyway, Flexigrid rocks! Kudos Paulo! Good Job! 😊

    : Just want to thank you all guys for the help. Y’all a master!

    : By the way, suggest what about check box instead of highlighting? to check the record(s) before going to delete? Would that be possible, at least I can say, a user can verify or confirm easily that he/she is going to delete a or those records just by seeing a check in the tick box?

    Would that be possible? Hope you can do that too, I want to do it, but “he,he,he,” not a master like you guys… peace.V,,

    Thanks and hope to see that feature.

    Hi wish_bear,

    I have a post here somewhere regarding the use of the process API method where I pass the cell object to the function.
    Using this, it is possible to insert a checkbox within the cell.

    Paulo

  • #163 / Apr 11, 2008 9:29am

    paulopmx

    164 posts

    What’s the largest amount of records anyone has used with this? I’m trying to use about 1200 but it’s dying. I’m not sure if it’s too much for the grid or if it’s because I’m using asp and sybase so I cant use LIMIT.

    Synergiq, this is really more of the limitation of how Javascript manages your memory and your browser. Flexigrid does its best to clean up the memory after loading new data, but basically every row we create has a memory hit, because of the events that we attach. You will see also that the each browser (ie,firefox,safari) handles memory management differently, for example firefox 2, i find tries to reserve the largest memory that your script has used even after reloading the page, instead of returning it to the system, with the believe that you might need it again for the same script.

    So if you could limit your rows the better, and just use paging.

  • #164 / Apr 11, 2008 10:19am

    ecarsted

    19 posts

    Heya Paulo,

    Sorry for the re-request ;

    How do i get the row id so I can create a call to get the details for that record;

    function yourfunction()
    {
    $(".selectrow").click(function(){
    alert("HIT!");    (Something goes here to get the row id)
    });
    }

    Eric

    Where are you going to attach this event? to the process API?
    Do you want to call the function when the user clicks the row or a cell or a link inside a cell?

    function addCellClassfunction(cellDiv)
    {
      $(cellDiv).addClass('editcell');
    }
    
    $(".editcell").click(function(event){
    
    });

    and I add

    process : addCellClassfunction

    to every col in the model. I know it is working as .editcell get called no mater which column they click on.  I guess I Just need to walk up the DOM tree to get the right data. 

    Eric

  • #165 / Apr 11, 2008 10:26am

    paulopmx

    164 posts

    Heya Paulo,

    Sorry for the re-request ;

    How do i get the row id so I can create a call to get the details for that record;

    function yourfunction()
    {
    $(".selectrow").click(function(){
    alert("HIT!");    (Something goes here to get the row id)
    });
    }

    Eric

    Where are you going to attach this event? to the process API?
    Do you want to call the function when the user clicks the row or a cell or a link inside a cell?

    function addCellClassfunction(cellDiv)
    {
      $(cellDiv).addClass('editcell');
    }
    
    $(".editcell").click(function(event)){
    }

    and I add

    process : addCellClassfunction

    to every col in the model. I know it is working as .editcell get called no mater which column they click on.  I guess I Just need to walk up the DOM tree to get the right data. 

    Eric

    Ok try this:

    $(".editcell").click(function(event)){
         var rowid = $(this).parent().parent().attr('id').substring(3);
    }
.(JavaScript must be enabled to view this email address)

ExpressionEngine News!

#eecms, #events, #releases