Part of the EllisLab Network
   
50 of 64
50
Flexigrid - Lightweight but rich data grid
Posted: 24 July 2008 03:22 AM   [ Ignore ]   [ # 491 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  167
Joined  04-23-2007
Armorfist - 23 July 2008 10:23 AM

Oh and paulo:

In the next release can you include the string “Quick Search” and “Clear” from the search box feature as a property like “pagestat”?
I have to manually change this in every release

Thanks!

Sure, no problem, someone also suggested the post variables can be renamable as well, i’ll publish these two updates together.

 Signature 

A Better and more Flexible Paging Solution for CI
Automatic config[base_url]

Profile
 
 
Posted: 24 July 2008 03:39 AM   [ Ignore ]   [ # 492 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  167
Joined  04-23-2007
TheJayL - 21 July 2008 09:41 AM

Ok I found a major issue with my code.  The grid breaks when I include an ajax function that I created.  When I reorder the columns: Basically at the end of DragEnd I call my ajax function to store the new column order.  Everything seems to look and work fine and my code writes out the sessions vars.  If I reload the page it stays the way I left it.

However, if I use any of the grids functions like next page or change the rows per page or show/hide columns (basically anything the grid reloads the data but not the whole page) I get errors in the grid.  They all are linked to this one action of mine.  The biggest error is that the grid populates, but with the old column order.  The headers are still correct, but the actual data is not.  So my columns are not matching up.  Once I reload, everything looks and operates as it should until I use one of the built in Flexi operations again.

This makes me think either the JS is taking care of managing its own column layout, independent of the XML, or my ajax command is somehow breaking the JS and not allowing it to update itself.  Once I take out the Ajax it all works great.

I have also checked the XML after the columns have been reordered and it is correct, and I have “alerted” the column titles after the Grid populates, both are correct.  My leaning towards something going haywire in this like of code, but not sure:

td[removed] = $(“cell:eq(”+ idx +”)”,robj).text(); 

Any ideas as to where to look would be great.

Hi,

Ok the ordering works like this: at initial setup, the ordering of columns is base on the order of your colModel, and stored on the axis attribute. This must then be match by your backend. Now once the user reorders the columns and data is repopulated, the script looks at your old order and base the ordering through that.

Now to using your session vars, dynamically order the loading of the colModel using PHP base on your session vars, and on the backend dynamically order the columns base on your session vars as well.

Paulo

 Signature 

A Better and more Flexible Paging Solution for CI
Automatic config[base_url]

Profile
 
 
Posted: 24 July 2008 03:44 AM   [ Ignore ]   [ # 493 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  167
Joined  04-23-2007
tof - 22 July 2008 10:14 AM

hello,
i’m going to use flexigrid for my new programs.
however, i would like to dynamically parse the grid’s attributes to add new functions to the grids (printing, csv output, etc).
i’ve passed the all day trying to get the colModel definition but i didnt succeed.
i want to get the colModel definition, the sortname & sortorder attributes, in javascript, so that i can generate the sql command coresponding to the user choices once he had played with the grid appearance…
maybe someone here can help me ?

I actually don’t understand why you need the grid’s attributes to add new functions of (printing, csv output, etc).

But to get the attributes try this custom api method

$.fn.flexAttr = function(p) {

        
return this.each( function() {
                
if (this.grid) return this.p;
            
});

    
};

 Signature 

A Better and more Flexible Paging Solution for CI
Automatic config[base_url]

Profile
 
 
Posted: 24 July 2008 03:46 AM   [ Ignore ]   [ # 494 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  167
Joined  04-23-2007
Wallcrawler - 23 July 2008 09:03 PM

Hi guys!

First of all, flexigrid is a superb jquery plugin!

But i´m facing some troubles to get it work perfectly.

Please see the page http://www.goldmaxbrasil.com.br/desenvolvimento/sisfinanceiro/lanc_financ/contas_pagar_quitacao.asp, and click in “mostrar” button.

The flexgrid is shown, but the margin of each header didn’t match with the rows. If you access this page using IE7 more visual problems is shown. What have i done wrong?

Otherwise, how can i put a function to be executed when the user select one row?

Thank you!

Can’t access your link. But it could be a CSS conflict problem.

for single select, use the new option { singleSelect: true } when creating your flexigrid.

 Signature 

A Better and more Flexible Paging Solution for CI
Automatic config[base_url]

Profile
 
 
Posted: 24 July 2008 03:47 AM   [ Ignore ]   [ # 495 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  167
Joined  04-23-2007
dave_in_chapelhill - 22 July 2008 10:50 PM

In reply to my own prior post…

Apparently, showTableToggleBtn and showToggleBtn are distinct. Thus, there should be a showTableToggleButton default in parameters at top of flexigrid.js.

Further, to address the JS error mentioned when hover over header column name when showToggleBtn is false:
Node cannot be inserted at the specified point in the hierarchy” code: “3
[Break on this error] this.appendChild( a );

I fixed this, tho probably not optimally, by two edits in flexigrid.js:

Comment out/change:

//            if (p.showToggleBtn) $(g.gDiv).prepend(g.nBtn);
            
$(g.gDiv).prepend(g.nBtn);

Wrap an ‘if’ around hover processing:

if (p.showToggleBtn) // DLC patch
{
  
(g.nDiv).hide();$(g.nBtn).hide();
  $(
g.nBtn).css({'left':nl,top:g.hDiv.offsetTop}).show();
  var
ndw = parseInt($(g.nDiv).width());
  $(
g.nDiv).css({top:g.bDiv.offsetTop});
  if ((
nl+ndw)>$(g.gDiv).width())
    (
g.nDiv).css('left',onl-ndw+1);
  else
    $(
g.nDiv).css('left',nl);
  if ($(
this).hasClass('sorted'))
    $(
g.nBtn).addClass('srtd');
  else
    $(
g.nBtn).removeClass('srtd');
}

thanks for the heads up.

 Signature 

A Better and more Flexible Paging Solution for CI
Automatic config[base_url]

Profile
 
 
Posted: 24 July 2008 03:49 AM   [ Ignore ]   [ # 496 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  126
Joined  10-18-2007

paulo:
Is it possible, by abdicating the “drag” and “resize” features, to be able to size the columns in %?

Thanks

 Signature 

Eye View Design - Design Studio
CI FlexiGrid - FlexiGrid on CI Implementation

Profile
 
 
Posted: 24 July 2008 03:52 AM   [ Ignore ]   [ # 497 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  167
Joined  04-23-2007
Ibere - 18 July 2008 12:44 PM

Hi, I’m triing to use flexigrid, in the easy way… (without json or ajax), just a simple table (with all TRs and TDs tag), and in the flexigrid starter I had assigned buttons to test function, but when I try to retrieve a row reference (id), i get an empty string..
The script that I am using to get the list, is the same script that was posted early in this forum.
  var items = $(’.trSelected’,grid);
  var itemlist =’‘;
  for(i=0;i<items.length;i++){
    itemlist+= items.id.substr(3)+",";
  }
  alert(“Items selected: “+itemlist);

and the start of flexigrid is:

$(’#users’).flexigrid(
{ colModel:[{display: 'id',name: 'id', width : 100, sortable : true, align: 'left'},
        {display: 'Login',name: 'login', width : 100, sortable : true, align: 'left'},
        {display: 'Nome',name: 'nome', width : 400, sortable : true, align: 'left'} ],
  buttons : [ {name: 'Add', bclass: 'add', onpress : test},
          {name: 'Delete', bclass: 'delete', onpress : test},
          {name: 'Alter', bclass: 'change', onpress : test} ],
  searchitems : [ {display: 'Login', name : 'login', isdefault: true},
            {display: 'Nome', name : 'nome'} ],
  sortname: “id”, sortorder: “asc”, title: ‘Users table’, width: 520, height: 400 } )

well.. what I am doing wrong ? how can I know what row was selected when test function is called ?
sorry about my poor english… is not my native language (I’m brazilian).. and thanks a lot
ah.. and congratulations about your amazing project…

Reference id comes from dynamic data which adds a id=“row”+id on every row. you can load this yourself on your static table by adding an id on your row in this format: ‘row’ + id.

 Signature 

A Better and more Flexible Paging Solution for CI
Automatic config[base_url]

Profile
 
 
Posted: 24 July 2008 03:52 AM   [ Ignore ]   [ # 498 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  167
Joined  04-23-2007
millercj - 19 July 2008 11:27 PM

I’ve been using flexigrid for a few different projects and I recently cut/pasted it into one i’m working on now but i’ve got some sort of glitch that i can’t locate. What is happening is the column headers and the data columns are displaying with different widths. Any ideas?

I just re-downloaded the CSS from the site and uploaded it as a double check, so it is the original css file, but that made no difference.

This can be a CSS conflict. try removing your own css and see if it makes a difference. if it does, then you know there is a conflict.

 Signature 

A Better and more Flexible Paging Solution for CI
Automatic config[base_url]

Profile
 
 
Posted: 24 July 2008 04:04 AM   [ Ignore ]   [ # 499 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  167
Joined  04-23-2007
Armorfist - 24 July 2008 03:49 AM

paulo:
Is it possible, by abdicating the “drag” and “resize” features, to be able to size the columns in %?

Thanks

Nope. for one thing the header and the main table is actually separate tables, that’s how you get the scrolling while having the column headers stay. for another reason, one of the main problems i’ve had (and I’m sure the guys that makes this kind of grid had) with tables is that browsers handle table sizes differently, specially %. So to fix this, i handle the size setting of the columns by placing a div within the cell, and I resize that div not the cell.

 Signature 

A Better and more Flexible Paging Solution for CI
Automatic config[base_url]

Profile
 
 
Posted: 24 July 2008 06:59 AM   [ Ignore ]   [ # 500 ]  
Summer Student
Total Posts:  2
Joined  07-24-2008

I have two text boxes (ids are #sdate and #edate) with search button(search) where these form controls are placed outside the flex grid container.

When i click on search button by entering values in two text boxes the value are passing correctly via URL but the problem comes when I modify values again and click on search button, the prior values which I have entered is taking up and I want the newly entered values should be passed in the URL string when I click on search button.


seems URL have got cached.


I appreciate if anyone have solution for this.


I have sample code below:


[color=blue][size=1]$("#search").click(function()
    
{
    
         
$("#flex").flexigrid
            
(
            
{
            url
: 'controler.php?action=du&sdate;='+$('#sdate').val()+'&edate;='+$('#edate').val,
            
}
             }
);    
    
});


<
fieldset>
                               
Start Date
                  
<input name="sdate" type="text" id="sdate" size="10" />
                  
                  
End Date
                  
<input name="edate" type="text" id="edate" size="10" />
                  
Database

                  
<select style="width:110px;" id="dboptions" name="dboptions" size="1" >
                                
                  </
select>
                  <
input type="hidden" name="subsdu" value="1">
                  <
input id="search" type="button"  value=":: Search" class="button" />
               
                </
fieldset>[/size][/color]

Profile
 
 
   
50 of 64
50
 
Post Marker Legend
New Topic New posts Hot Topic Hot Topic with new posts New Poll New Poll Moved Topic Moved Topic Sticky Topic Sticky topic
Old Topic No new posts Hot Old Topic Hot Topic with no new posts Old Poll Old Poll Closed Topic Closed Topic Announcement Announcements
Theme
Change Theme
Visitor Statistics
The most visitors ever was 719, on June 06, 2008 10:16 AM
Total Registered Members: 64454 Total Logged-in Users: 21
Total Topics: 80961 Total Anonymous Users: 0
Total Replies: 435697 Total Guests: 192
Total Posts: 516658    
Members ( View Memberlist )